Question

我正在尝试使用gulp任务测试已使用jest导入SASS的React组件。这里的问题是gulp-jest不映射模块名称（因此它不能跳过.scss文件）并且测试失败（throws：“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);
  });
});

这是gulpfile：

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命令的确切配置（只是想通过在gulpfile中更改require（）来配置它本身来简化它。）

Answer 1

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

gulp-jest不应用config（moduleNameMapper是特定的）

1 个答案: