How to work with moduleNameMapper

[Rahulgarg30591]

This is my gulp task for Jest testing.

gulp.task('jest:cc', () => {
    process.env.NODE_ENV = 'test';
    process.env.REACT_SPINKIT_NO_STYLES = JSON.stringify(true);

    return gulp.src('./').pipe(jest({
        collectCoverageFrom: [
            'public/**/*.{js,jsx}',
        ],
        testPathIgnorePatterns: [
            '<rootDir>/dist/', '<rootDir>/build/', '<rootDir>/node_modules/',
            '<rootDir>/docs/', '<rootDir>/gulpTasks/',
        ],
        moduleNameMapper: {
            '\\.(css|scss)$': '<rootDir>/tests/config/styleMock.js',
        },
        collectCoverage: true,
        automock: false,
    }));
}).help = 'To run the JEST test cases with code coverage.';

But I am always getting this error:

({"Object.":function(module,exports,require,dirname,filename,global,jest){.overlay { ^ SyntaxError: Unexpected token .

  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:305:17)
  at Object.<anonymous> (public/EWAWeb.jsx:1:861)
  at Object.<anonymous> (tests/EWAWeb.test.jsx:5:15)
  at next (native)

How to get moduleNameMapper work, I want to mock all the CSS and SCSS files import of the component I am testing.

I am using "gulp-jest": "^3.0.1", "jest-cli": "^21.2.1",

Thank you.

[renet]

I just had the same problem. Moving the config (or at least parts of it) from the gulp task config to the package.json as described here solved it for me:

https://facebook.github.io/jest/docs/en/webpack.html#handling-static-assets