Webpack别名在Vue Styleguidist中不起作用

时间:2019-09-23 10:09:21

标签: nuxt.js vue-styleguidist styleguidist

我正在Nuxt.js项目中使用Vue Styleguidist。基于Styleguidist和Webapack文档,我已经配置了styleguide.config.js文件并设置了一些别名:

module.exports = {
 ...

   webpackConfig: {
        resolve: {
            alias: {
                '~icons': path.resolve(__dirname, 'components/icons/'),
            },
        },

        module: {
            rules: [
                {
                    test: /\.vue$/,
                    exclude: /node_modules/,
                    loader: 'vue-loader',
                },
                {
                    test: /\.js?$/,
                    exclude: /node_modules/,
                    loader: 'babel-loader',
                },
                {
                    test: /\.(css?|scss|sass)(\?.*)?$/,
                    use: [
                        'style-loader',
                        'css-loader',
                        'sass-loader',
                    ],
                },
            ],
        },
        plugins: [
            new VueLoaderPlugin(),
        ],
   } 

};

组件正在使用此别名,如下所示:

import FooIcon from '~icons/foo';

尽管Styleguide无法解析地址。我相信styleguide.config.js中的别名会以某种方式被忽略。

有人知道我应该如何解决这个问题?

0 个答案:

没有答案