javascript - 开 Jest 试图解析 .css

Question

我有一个 Jest 的问题，无论我做什么，它总是试图将 css 文件解析为 javascript。

使用 webpack 正确构建文件。

我有以下的 Jest 配置

"jest": {
    "rootDir": "./src",
    "moduleNameMapper": {
      "^.*[.](css|CSS)$": "../jest/styleMock.js"
    }
  },

我还尝试了一个脚本预处理器来从导入中剥离 css:

 "jest": {
    "rootDir": "./src",
    "scriptPreprocessor": "../node_modules/jest-css-modules"
  },

它一直在抛出错误。

({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){.button {
                                                                                             ^
    SyntaxError: Unexpected token .

Answer 1

最好的解决方案是在 Jest 配置中使用 moduleNameMapper 行，如 described in the Jest docs .

package.json 中的最小“忽略 css” Jest 配置可能像这样

  "jest": {
    "moduleNameMapper": { "\\.(css|less)$": "<rootDir>/assets/css/__mocks__/styleMock.js" }
  },

那么 styleMock.js 就是这个

module.exports = {};