Question

在我的本机项目上运行测试套件时，始终出现以下错误。

/.../node_modules/@expo/react-native-action-sheet/ActionSheet.ios.js:3
import React from 'react';
       ^^^^^

SyntaxError: Unexpected identifier

  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)
  at Object.<anonymous> (node_modules/@expo/react-native-action-sheet/index.js:1:45)

以下是使用的测试代码。这是Jest中的一个简单的快照测试

//ContactList Tests
import React from 'react';
import renderer from 'react-test-renderer';
import ContactList from '../components/ContactList';


//ContactList Snapshot
test('renders correctly', () => {
    const tree = renderer.create(<ContactList />).toJSON();
    expect(tree).toMatchSnapshot();
  });

我正在运行react-native版本0.55.4和Jest版本23.6.0

Answer 1

我以前见过

来自Jest docs：

有时会发生（尤其是在React Native或TypeScript项目中）第三方模块以未编译的形式发布。由于默认情况下不会转换node_modules内部的所有文件，因此Jest无法理解这些模块中的代码，从而导致语法错误。为了克服这个问题，您可以使用transformIgnorePatterns将此类模块列入白名单。您将在React Native Guide.
中找到此用例的一个很好的例子。

他们提到的《 React Native Guide》中，您将从package.json中找到以下部分（该部分将嵌套在jest对象中）：

"transformIgnorePatterns": [
  "node_modules/(?!(react-native|my-project|react-native-button)/)"
]

这是一个正则表达式为负的正则表达式，它的意思是：在node_modules中，不是的所有内容都会紧跟着react-native，my-project ，或react-native-button将被忽略（不转换）。

或者为了简化这种双重否定，将要转换node_modules内的这三个包，但不能转换其他包。

在您的情况下，此正则表达式可能如下所示：

"node_modules/(?!(react-native|@expo/react-native-action-sheet)/)"

这将允许react-native和@expo/react-native-action-sheet都被转译（我认为...您可能需要对其进行一些操作。可能会有一些字符转义或一些其他需要的软件包被列入白名单）。

在React-Native项目上开玩笑时出错

1 个答案: