gulp-jest 不应用配置（具体为 moduleNameMapper）答案

【问题标题】：gulp-jest doesn't apply config (moduleNameMapper to be specific)gulp-jest 不应用配置（具体为 moduleNameMapper）
【发布时间】：2017-08-29 17:56:03
【问题描述】：

我正在尝试使用 gulp 任务测试已通过 jest 导入 SASS 的 React 组件。这里的问题是 gulp-jest 不映射模块名称（因此它不能跳过 .scss 文件）并且测试失败（抛出：“SyntaxError: Unexpected token *”）。我不知道它为什么会这样。

最奇怪的是，它可以通过“npm test”和 jest-cli 完美运行，但由于某种原因不能使用“gulp test”。

这是组件：

import React from 'react';
import '../../scss/App.scss';

export default class App extends React.Component {
  render() {
    return (
      <div className="main">
        <h1>Here we go!</h1>
      </div>
    )
  }
}

这是测试：

import React from 'react';
import App from '../src/js/components/App';

describe('App', () => {
  test('should be a React component', () => {
    let instance = App.prototype instanceof React.Component;
    expect(instance).toBe(true);
  });
});

这是 gulp 文件：

var gulp = require('gulp');
var jest = require('gulp-jest').default;

gulp.task('test', () => {
  process.env.NODE_ENV = 'test';
  return gulp.src('test')
    .pipe(jest({
      config: {
        "transformIgnorePatterns": [
          "<rootDir>/dist/", "<rootDir>/node_modules/"
        ],
        "automock": false,
        "moduleNameMapper": {
          "\\.scss$": "<rootDir>/jestignore.js"
        }
      }
    }));
});

根目录下的 jestignore.js 只是导出空对象。

我确实有 jest.config.js 文件导出 npm test 命令的确切配置（只是想通过将 require() 更改为在 gulpfile 中配置自身来为您简化它）。

【问题讨论】：

标签： node.js webpack gulp jestjs gulp-jest

【解决方案1】：

如果您使用 jest 21，这是一个已知的 gulp-jest 问题：https://github.com/alansouzati/gulp-jest/issues/41。降级到 jest 20 应该会有所帮助。

【讨论】：

其实我在这个项目中使用了v20。我试图将配置转换为字符串，但没有帮助。希望 gulp-jest 的这个问题在 v21 版本中引起了人们的注意并很快得到修复。
没错，将配置作为 json 字符串传递给 jest-gulp 将无济于事。问题是 jest-gulp 修改了传递的配置，假设它是一个破坏配置字符串的对象。