在Webpack应用程序中应用全局样式

时间:2019-02-20 14:38:43

标签: javascript webpack sass global stylesheet

我需要在webpack应用中全局应用reset.scss,以重置边距,边框,填充等。

我不知道什么是正确的方法。 我都尝试过sass-loader

npx create-nuxt-app cleint
npx: installed 379 in 9.49s
Unexpected identifier

...和sass-resources-loader

module.exports = {

    // [...]

    module: {
        rules: {

            // [...]

            {
                test: /\.scss$/,
                use: [
                    "vue-style-loader",
                    "css-loader",
                    {
                        loader: "sass-loader",
                        options: {
                            data: `@import "./src/styles/base/_reset.scss";`
                        }
                    }
                ]
            }
        }
    }

}

两个解决方案均无效。他们所做的是使在指定的.scss文件中定义的变量或mixins可用于其他组件(无需再次导入scss文件)。但是我要做的只是将reset.scss全局应用于整个应用程序,就像在index.html文件中包含.css文件时一样。

请说明在webpack应用程序中执行此操作的正确方法。

0 个答案:

没有答案