node-sass - 您正在尝试使用 "scss"。缺少 node-sass

Question

我的项目正在运行 node-sass 但我决定将其更改为 sass (dart-sass) 因为我想避免安装 python、g++ 和 make 只是为了运行 npm install，而 node-sass 强制你这样做是因为节点石膏。

所以我跑了

$ npm uninstall node-sass
$ npm install sass

运行 npm run build (vue-cli-service build) 工作正常，但我的持续集成在 npm run test:unit 上失败(vue-cli-service test:unit).

这是完整的错误:

 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

我该怎么做才能修复这个错误？我不想回到 node-sass。

Answer 1

我认为这个错误的发生是因为 vue-jest 试图在单元测试中编译 CSS。 sass (dart-sass) 包没有这个特性，但是 node-sass 有。

一个快速修复以在单元测试中进行样式编译为代价是防止 vue-jest 编译样式:

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

我正在使用 vue-jest@3.0.7

From vue-jest docs :

experimentalCSSCompile:
Boolean Default true.
Turn off CSS compilation

I also found this japanese blog post (automatically translated here)详细说明了这个错误

这样做的一个副作用是单元测试现在运行得更快