Question

我在从Windows 8.1上使用create-react-app创建的全新安装的应用程序中运行Jest时遇到问题。安装后，运行命令npm run test，我得到了错误：

No tests found related to files changed since last commit.

运行jest --watchAll，因此绕过同一目录中的react-scripts会显示：

Test suite failed to run

Jest encountered an unexpected token

This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

Here's what you can do:
 • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
 • If you need a custom transformation specify a "transform" option in your config.
 • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html

Details:

SyntaxError: E:\demo\src\App.test.js: Unexpected token (7:18)

  5 | it('renders without crashing', () => {
  6 |   const div = document.createElement('div');
> 7 |   ReactDOM.render(<App />, div);
    |                   ^
  8 |   ReactDOM.unmountComponentAtNode(div);
  9 | });

搜索了很长时间，并按照人们对类似问题的建议，我开始在package.json上添加Babel devDependencies。它变成了这样：

"devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/plugin-proposal-class-properties": "^7.2.3",
    "@babel/plugin-transform-runtime": "^7.2.0",
    "@babel/preset-env": "^7.2.3",
    "@babel/preset-react": "^7.0.0",
    "@babel/register": "^7.0.0",
    "@babel/runtime": "^7.2.0",
    "babel-eslint": "^10.0.1",
    "babel-jest": "^23.6.0",
    "babel-loader": "^8.0.5",
    "babel-plugin-root-import": "^6.1.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react-optimize": "^1.0.1",
    "jest-transform-stub": "^1.0.0"
  }

我也将.babelrc文件添加为：

{
    "presets": [
        "@babel/react" ,
        "@babel/env"
    ],
    "plugins": [
        "@babel/plugin-proposal-class-properties"
    ]
 }

无论我尝试哪种组合，我总是会遇到不同的错误，这是不对的。看着互联网上的人们，所有人都可以通过create-react-app开箱即用地使用Jest命令。

最后一次尝试使用所有这些依赖项会导致以下错误：

Test suite failed to run

    E:\dev\demo\src\App.test.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import React from 'react';
                                                                                                    ^^^^^

    SyntaxError: Unexpected identifier

      at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)

有什么想法吗？！我感到困惑。

Answer 1

create-react-app是CLI，它生成react-scripts预先配置的设置，其中包括Webpack和Jest配置。

当Jest直接用作jest时，它将忽略生成的配置，需要从头开始进行配置。

npm test（在CRA设置中默认为react-scripts test）而不是jest，以利用生成的Jest配置。

如果npm test的问题是交互模式：

自上次提交以来未找到与文件相关的测试。按a运行所有测试，或使用--watchAll
运行Jest。

可以用npm test a来解决。

来自create-react-app的笑话未在Windows上运行

1 个答案: