You are trying to use "scss". node-sass is missing

Question

My project is running node-sass but I decided to change that to sass (dart-sass) because I want to avoid installing python, g++ and make just to run npm install, which node-sass forces you to do because of node-gyp.

So I ran

$ npm uninstall node-sass
$ npm install sass

Running npm run build (vue-cli-service build) works fine, but my continuous integration failed on npm run test:unit (vue-cli-service test:unit).

Here's the full error:

 FAIL  tests/unit/example.spec.ts
● Test suite failed to run[vue-jest] 
Error: You are trying to use "scss". node-sass is missing.

    To install run:  
npm install --save-dev node-sass
at error (node_modules/vue-jest/lib/throw-error.js:2:9)
at module.exports (node_modules/vue-jest/lib/ensure-require.js:38:5)                                                                                                                                                                     at module.exports (node_modules/vue-jest/lib/compilers/scss-compiler.js:20:3)
at processStyleByLang (node_modules/vue-jest/lib/process-style.js:11:82)
at processStyle (node_modules/vue-jest/lib/process-style.js:20:17)
at node_modules/vue-jest/lib/process.js:93:13
at Array.map (<anonymous>)
at Object.module.exports [as process] (node_modules/vue-jest/lib/process.js:90:8)
Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        1.265s, estimated 2s

What do I do to fix this error? I don't want to go back to node-sass.

Answer 1

I think this error is happening because vue-jest is trying to compile CSS in unit tests. The sass (dart-sass) package doesn't have this feature, but node-sass does.

A quick fix at the cost of having style compilation in unit tests is to prevent vue-jest from compiling styles:

//package.json `"jest":` property or jest.config.js `module.exports = `
{
  "globals": {
     "vue-jest": {
       "experimentalCSSCompile": false
      }
   }
}

I'm using [email protected]

From vue-jest docs:

experimentalCSSCompile:
Boolean Default true.
Turn off CSS compilation

I also found this japanese blog post (automatically translated here) that details this error

A side effect of this is that unit tests now run much faster