Question

我正在尝试测试使用jest构建的React Native模块。我目前有一个执行jest时运行的测试文件，它看起来像这样：

import 'react-native';
import React from 'react';
import App from '../App';
import {MySDK} from 'react-native-mysdk’


it(‘test1’, () => {
  MySDK.API();
});

运行jest时我会得到

      API(): Promise<string> {
                        ^

    SyntaxError: Unexpected token :

我的babel.config.js看起来像：

module.exports = {
  presets: ["module:metro-react-native-babel-preset"]
}

我的package.json看起来像：

  "dependencies": {
    "@babel/runtime": "^7.0.0",
    "babel-cli": "^6.26.0",
    "babel-eslint": "^8.2.2",
    "babel-plugin-module-resolver": "^3.1.3",
    "babel-preset-flow": "^6.23.0",
    "babel-preset-react-native": "2.1.0",
    "flow-typed": "^2.3.0",
    "flow-bin": "^0.92.0",
    "react": "16.6.3",
    "react-native": "0.58.3”,
   “react-native-mysdk”: “0.0.1”
  },
  "devDependencies": {
    "babel-jest": "16.0.0",
    "babel-preset-react-native": "1.9.0",
    "jest": "16.0.2",
    "jest-react-native": "16.0.0",
    "react-test-renderer": "15.3.2"
  },
  "jest": {
    "preset": "react-native"
  }

我尝试用以下方式更新babel文件：

module.exports = {
  presets: ["module:metro-react-native-babel-preset", "@babel/preset-flow"],
  plugins: ["@babel/plugin-transform-flow-strip-types"]
}

但是我遇到同样的错误。

如何将玩笑与使用玩笑的javascript文件一起使用？

Answer 1

在运行测试时，您将需要使用@babel/plugin-transform-flow-strip-types插件来删除流类型。安装它，并将其作为插件数组项添加到您的babel配置文件中。另外，您可以使用@babel/preset-flow，它已经包含必需的插件。

请参阅：https://babeljs.io/docs/en/babel-preset-flow

示例设置

您需要安装以下软件包：

npm i --save jest module:metro-react-native-babel-preset babel-jest @babel/preset-env @babel/core @babel/preset-flow

您为package.json配置的jest应该是：

"jest": {
  "transform": {
    "^.+\\.jsx?$": "babel-jest"
  }
}

您的babel.config.js应该是：

module.exports = {
  "presets": [
    [
      "@babel/preset-env",
      {
        targets: {
          node: 'current',
        }
      },
    ],
    "module:metro-react-native-babel-preset",
    "@babel/preset-flow"
  ],
}

用玩笑来编写带有流程的测试

1 个答案:

示例设置