如何从项目中导入的外部vue库中提取样式?

时间:2019-02-04 08:21:46

标签: vue.js webpack webpack-style-loader vue-loader

我有一个带有 vue-webpack 模板的项目。 我使用 extract-text-plugin 提取项目中的样式。 但是当我导入外部库时, vue-loader 不会将样式提取到css文件中,而是转到头部的样式标签。

import vueSlider from 'vue-slider-component';
import ToggleButton from 'vue-js-toggle-button';

但这对我自己的vue组件来说是正确的。

我已将 css scss vue-loader 配置更改为也用于 node_modules id 不提取 如何将所有样式提取到 css 而不是样式标签中? 这是我的 webpack 配置:

{
        test: /\.vue$/,
        loader: 'vue-loader',
        include: [resolve('src'), resolve('node_modules')],
        options: {
            loaders: {
                css: ExtractTextPlugin.extract({
                    use: 'css-loader',
                    // fallback: 'vue-style-loader'
                }),
                scss: ExtractTextPlugin.extract({
                    use: ['css-loader', 'sass-loader'],
                    // fallback: 'vue-style-loader'
                })
            }
        }
      }

webpack.base.conf

{
        test: /\.css$/,
        use: ExtractTextPlugin.extract({
            // fallback: "vue-style-loader",
            use: "css-loader"
        })
      },
{
        test: /\.scss$/,
        use: ExtractTextPlugin.extract({
            // fallback: 'vue-style-loader',
            use: ['css-loader', 'sass-loader']
        })
      }

0 个答案:

没有答案