0

I am trying to add scss to my Vue.js 2 project, but for some reason it is not working. I tried installing the following:

npm install sass-loader node-sass style-loader --save-dev

Inside my build folder, I have webpack files, and there inside webpack.base.conf.js I tried to add loader:

loaders: [
      ...
// this one
      {
          test: /\.s[a|c]ss$/,
          loader: 'style!css!sass'
      }
    ]

Inside the build folder, there is also vue-loader.conf.js file, with this piece of code:

loaders: utils.cssLoaders({
    sourceMap: sourceMapEnabled,
    extract: isProduction
  }),

Should I change that to something else? I am new to vue, and what I found so far is not doing the job. I tried putting lang="scss" in style tag, but it throws an error after it.

This is how my build folder looks like, with the webpack files:

enter image description here

Nemanja G
  • 1,760
  • 6
  • 29
  • 48
  • Can you share your console error log? – s4k1b Jun 29 '20 at 12:23
  • @s4k1b This is the error: Module build failed: ValidationError: Invalid options object. Sass Loader has been initialized using an options object that does not match the API schema. – Nemanja G Jun 29 '20 at 12:33
  • https://stackoverflow.com/questions/58184549/sass-loader-error-invalid-options-object-that-does-not-match-the-api-schema may be checkout this – s4k1b Jun 29 '20 at 12:36
  • @s4k1b yeah, checked it out already but downgrading won't do the trick for me :/ – Nemanja G Jun 29 '20 at 12:37
  • I personally use `sass-loader@7.1.0` and `node-sass@4.11.0` I don't need to write any config files, and it works – s4k1b Jun 29 '20 at 12:40
  • Also, checkout the issue here, https://github.com/vuejs/vue-cli/issues/4513 – s4k1b Jun 29 '20 at 12:41

0 Answers0