javascript - 在 vue js 组件中使用手写笔 @import

Question

我想知道是否可以从 vue 文件的样式部分使用手写笔 @import 功能

假设我的 assets 文件夹中有一个包含此虚拟函数的 funcs.styl 文件

add(a)
  a + a

在我的 App.vue 中，我想使用该功能

<template>
  <div id="app">
    <h1>{{ msg }}</h1>
  </div
</template>

<script>

export default {
  name: 'app',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  }
}
</script>

<style lang="stylus" scoped>
@import "../assets/funcs.styl"

h1
 margin add(30px)

</style>

感谢@Potray，效果很好

塞布

Answer 1

你应该使用 webpack stylus-loader。

npm i --save-dev stylus stylus-loader

然后在你的 vue 组件中使用

<style lang="stylus"></style>

而不是常规标签。

希望这对你有用:)