Question

在vue.js文件的webpack.config.js项目中，我确实有这个：

///...,
resolve: {
  extensions: ['.js', '.vue', '.json'],
  alias: {
    'vue$': 'vue/dist/vue.common.js',
    'assets': path.resolve(__dirname, './src/assets'),
    'components': path.resolve(__dirname, './src/components')
  }
},
// ....

允许我在任何Vue component中使用其他组件：

import 'component/path/to/MyComponent'

不必怀疑我在组件树中的位置。

我希望你与styles具有相同的容量，尤其是'stylus``

我想说的确如此 a stylus file' in src / assets / funcs.styl：

add(a)
  a + a

和一个组件，比如说src/components/a/very/long/path/MyComponent.vue：

<template>
  <div id="my-component">
    <h1>{{ msg }}</h1>
  </div
</template>

<script>

export default {
  name: 'my-component',
  data () {
    return {
      msg: 'A title'
    }
  }
}
</script>

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

h1
 margin add(30px)

</style>

我希望能够替换这一行

@import "../../../../../../assets/funcs.styl"

由此

@import "assets/funcs"

使用适用于js文件的webpack解析和别名功能。这样可以避免在深度组件中可能需要的手写笔mixins和函数的大型项目中发现错误。

他们是这样做的吗？
它必须是功能请求吗？在webpack？在vue-style-loader？在stylus-loader？

任何精度都会受到高度赞赏;-)

的Seb

Answer 1

你应该使用

@import＆＃39; ~resources / funcs＆＃39;;

webpack解决了样式（stylus）的别名以及vue.js组件

1 个答案: