在vue文件中@import引入外部stylus文件，为什么路径前要加“~”，否则报错？

Question

1、已配置项目别名aliasresolve: {    extensions: ['.js', '.vue', '.json', '.css', 'styl'],    alias: {      'vue$': 'vue/dist/vue.esm.js',      '@': resolve('src'),      'base': resolve('src/components/base'),      'assets': resolve('src/assets')    }  },2、文件目录3、vue文件中引入stylus文件<style scoped>@import 'assets/css/variable'</style>结果报错bundle has 1 errors172:176 ./~/css-loader?{"minimize":false,"sourceMap":false}!./~/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-be4708e4","scoped":true,"hasInlineConfig":false}!./~/stylus-loader?{"sourceMap":false}!./~/vue-loader/lib/selector.js?type=styles&index=0!./src/components/views/programs/Programs.vueModule build failed: Error:    196| }   197| </script>   198|    199| <style scoped>   200| @import 'assets/css/variable'----------------^   201|    202| .search-wrapper但是改成@import '~assets/css/variable'就不会报错了，请问加~还不加有什么区别和原理？望赐教

Answer 1

~ 是 stylus-loader 到东东，参考 https://github.com/shama/styl...

~common 表示相对 common，然后我们在 webpack 配置了 common 的 alias，就能找到了它的路径了

大神的回答