webpack编译sass文件报错答案

【问题标题】：The webpack compiles the sass file for errorwebpack编译sass文件报错
【发布时间】：2017-10-27 01:54:46
【问题描述】：

“...加载样式”后的 CSS 无效：预期 1 个选择器或 at-rule 是“var content = requi”

我在使用 webapck 时需要使用 sass。然后就是这个错误。最后，我通过修改编译器来修改编译器。这是我的代码，我贴出来，有朋友遇到同样的问题。

{
  test: / \.scss $/,
  include: / node_modules /, / / emphasis is on this line of code problem solving
  loaders: [" style - loader ", "css-loader", "sass-loader"] / / webpack2 needs to be added in the back - loader
}

【问题讨论】：

上面的代码空间有点问题。请复制下面的代码。对不起
你知道你可以编辑帖子，对吧？

标签： webpack sass vue.js

【解决方案1】：

您不应该使用 webpack 来构建第三方 scss 文件。它们应该已经被转译为 css 并可供您用作导入。可能是问题的原因。此外，如果您使用的是 webpack 2，那么您的规则结构错误。来自 webpack 2 文档https://webpack.js.org/loaders/sass-loader/#components/sidebar/sidebar.jsx:

module: {
        rules: [{
            test: /\.scss$/,
            use: [{
                loader: "style-loader"
            }, {
                loader: "css-loader"
            }, {
                loader: "sass-loader",
                options: {
                    includePaths: ["absolute/path/a", "absolute/path/b"]
                }
            }]
        }]
    }

【讨论】：