无法使用 ts-jest 转换 node_modules 中的文件夹

Posted

技术标签:

【中文标题】无法使用 ts-jest 转换 node_modules 中的文件夹【英文标题】:can't transform a folder inside node_modules with ts-jest 【发布时间】:2019-06-08 11:31:30 【问题描述】:

我正在使用 typescript 编写测试,并且我在 node_modules/@my-modules 文件夹中有私有依赖项。我正在使用 ts-jest 编译器,但 jest 仍然抱怨 node_modules 文件夹中的 esnext 模块。

软件包版本:

"@types/jest": "^23.3.12",
"jest": "^23.6.0",
"ts-jest": "^23.10.5",

tsconfig.json:


  "compilerOptions": 
    "baseUrl": "./src",
    "outDir": "build/dist",
    "module": "commonjs",
    "target": "es5",
    "lib": ["es5", "es6", "dom", "esnext"],
    "sourceMap": true,
    "allowJs": true,
    "jsx": "react",
    "moduleResolution": "node",
    "rootDir": "src",
    "forceConsistentCasingInFileNames": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noImplicitAny": false,
    "strict": false,
    "strictNullChecks": true,
    "suppressImplicitAnyIndexErrors": true,
    "noUnusedLocals": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true
  

jest.config.js:

module.exports = 
  globals: 
    "ts-jest": 
      diagnostics: true,
      tsConfig: "<rootDir>/tsconfig.json",
    ,
  ,
  moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json"],
  preset: "ts-jest",
  roots: ["<rootDir>/src/"],
  setupTestFrameworkScriptFile: "<rootDir>/src/setupEnzyme.ts",
  snapshotSerializers: ["enzyme-to-json/serializer"],
  testEnvironment: "jest-environment-jsdom",
  transformIgnorePatterns: [
    "node_modules/(?!(@my-modules)/)",
  ]
;

运行 jest 时的确切错误:

 Details:

    /sites/frontend/node_modules/@my-modules/ui-components/.dist/src/index.js:1
    ("Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest)export  default as Calendar  from './components/calendar';
                                                                                             ^^^^^^

    SyntaxError: Unexpected token export

@my-modules 中转译文件的正确方法是什么?

【问题讨论】:

好吧,我终于解决了。稍后会分享答案 你是怎么解决的? 【参考方案1】:

现在适合我的配置

软件包版本:

"@types/jest": "^24.0.17",
"jest": "^24.8.0",
"ts-jest": "^23.10.5",

tsconfig.json:


  "compilerOptions": 
    "baseUrl": ".",
    "outDir": "build/dist",
    "lib": ["es5", "es6", "dom", "esnext"],
    "module": "esnext",
    "moduleResolution": "node",
    "target": "es5",
    "sourceMap": true,
    "allowJs": true,
    "jsx": "react",
    "rootDir": "src",
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true
  ,
  "exclude": [
    "node_modules",
    "build",
    "dist"
  ]


jest.config.js:

module.exports = 
  globals: 
    "ts-jest": 
      diagnostics: true,
      tsConfig: "<rootDir>/tsconfig.json",
    ,
  ,
  moduleDirectories: [
    "node_modules",
    "utils",
    __dirname,
  ],
  moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json"],
  moduleNameMapper: 
    "\\.(css|less)$": "identity-obj-proxy",
    "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":
      "<rootDir>/config/jest/fileMock.js",
  ,
  preset: "ts-jest",
  roots: ["<rootDir>/src/"],
  setupFilesAfterEnv: ["<rootDir>/config/jest/setupJest.ts"],
  snapshotSerializers: ["enzyme-to-json/serializer"],
  testEnvironment: "jest-environment-jsdom",
  transform: 
    "^.+\\.jsx?$": "babel-jest",
    "^.+\\.tsx?$": "ts-jest",
  ,
  transformIgnorePatterns: [
    "node_modules/(?!(@my-modules)/)",
  ],
;

config/jest/fileMock.js:

module.exports = 'test-file-stub';

【讨论】:

【参考方案2】:

我关注the tuto here 并且工作得像个魅力人

npm install --save-dev jest typescript ts-jest @types/jest npx ts-jest config:init

我的另一个解决方案是更新jest.config.ts,使其包含以下设置

transform: 
    //"^.+\\.(ts|tsx)$": "ts-jest",
  , 

【讨论】:

以上是关于无法使用 ts-jest 转换 node_modules 中的文件夹的主要内容,如果未能解决你的问题,请参考以下文章

React Jest 测试无法使用 ts-jest 运行 - 导入文件上出现意外令牌

Jest mock 总是给出 undefined (typescript + ts-jest)

ts-jest:TypeScript 类型错误被忽略

使用 ts-jest 和 webpack 允许 Jest 识别和解析模块别名需要啥?

Jest、Typescript、ts-jest:覆盖范围略有不正确

Jest,ts-jest,带有 ES 模块导入的打字稿:找不到模块