Tao.L
Tao.L

Reputation: 33

The webpack compiles the sass file for error

Invalid CSS after "...load the styles": expected 1 selector or at-rule, was "var content = requi"

I need to use sass when I'm using webapck. And then there's this error. Finally, I modified the compiler by modifying the compiler. Here's my code, I post it, and I have friends who have the same problem.

{
  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
}

Upvotes: 1

Views: 1095

Answers (1)

Chase DeAnda
Chase DeAnda

Reputation: 16441

You shouldn't be using webpack to build third party scss files. They should already be transpiled to css and available for you to use as an import. Might be the cause of the problem. Also, if you're using webpack 2 then your rules are structured wrong. From the webpack 2 docs 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"]
                }
            }]
        }]
    }

Upvotes: 1

Related Questions