SyntaxError：使用 Jest + react-native-animated-ellipsis 导入意外的令牌

Posted 2023-03-08

【中文标题】SyntaxError：使用 Jest + react-native-animated-ellipsis 导入意外的令牌

【英文标题】：SyntaxError: Unexpected token import with Jest + react-native-animated-ellipsis

【发布时间】：2018-09-16 09:10:13

【问题描述】：

我的快照测试因 react-native 失败。我遵循了一些解决方案，但没有任何效果。 我面临的错误是：

/Users/USER_NAME/Projects/project_name/node_modules/react-native-animated-ellipsis/dist/AnimatedEllipsis.js:1 (function (exports, require, module, __filename, __dirname) import React, Component from 'react'; ^^^^^^ SyntaxError：意外的令牌导入

  at node_modules/babel-core/lib/transformation/file/options/option-manager.js:178:20

在我的package.json：

"jest": 
    "preset": "react-native",
    "transform": 
      "^.+\\.js?$": "babel-jest"
    ,
    "testPathIgnorePatterns": [
      "/node_modules/",
      "Tests/Setup.js"
    ],
    "testMatch": [
      "**/**/__tests__/**/*.js?(x)",
      "**/?(*.)(spec|test).js?(x)"
    ],
    "transformIgnorePatterns": [
      "node_modules/(?!(react-native|rent-react-native|react-native-navigation|react-native-vector-icons|react-native-maps|react-native-animated-ellipsis)/)"
    ]
  ,

和.babelrc

  "presets": ["react-native"],
  "env": 
    "test": 
      "presets": ["env", "react-native"],
      "plugins": ["react-native-animated-ellipsis"],
      "only": [
        "./**/*.js",
        "node_modules/react-native-animated-ellipsis"
      ]
    
  

【问题讨论】：

我们也遇到了这个问题。通过transformIgnorePatterns 排除其他软件包似乎有效，但react-native-animated-ellipsis 无效

解决了这个问题，只需从 repo 复制组件并将其直接放入我们的项目中。回购似乎很陈旧，我没有费心要求他们修复他们的 dist 文件夹以兼容 es5。

【参考方案1】：

我不确定您为什么要对项目的一个依赖项应用 babel 转换，但遵循错误消息，即使您想在 react-native-animated-ellipsis 上应用 babel 转换，您可能应该在 src 上执行并排除 dist 文件夹。