webpack配置别名后scss找不到路径？

Question

vue-cli搭建的项目

webpack.base.config.js

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

在vue文件中

import Slider from '~base/slider/slider.vue';
import {getRecommend} from '~api/recommend.js';
import {ERR_OK} from '~api/config.js';

这样是可以找到文件的

但在scss文件中

@import "~common/scss/mixin.scss";
@import "~common/scss/variable.scss";

这样就找不到了。必须从当前scss文件路径下开始向上找才能找到。

请问这个是在哪里配置？THANK Q.

Answer 1

@import "~common... -》 @import "~～common 加一条波浪线。。。
或者 把 alias ～common 改成 common ，下面用 ～common 访问试一下