使用 babel 和 Jest 在 ES2017 中意外导入令牌

Posted 2023-03-07

【中文标题】使用 babel 和 Jest 在 ES2017 中意外导入令牌

【英文标题】：unexpected token import in ES2017 with babel and Jest

【发布时间】：2018-04-12 06:20:01

【问题描述】：

我尝试在我的项目中使用 Jest 与 bablejs 和 ES2017，根据 Jest Getting Started 页面和 Bablejs config for ES2017 这是我的 .babelrc 文件：

  "presets": ["es2017"],
  "env": 
  "test": 
  "presets": ["es2017"]
  
 

我的包 json 是：

 
   "name": "",
   "version": "1.0.0",
   "description": "",
   "main": "index.js",
   "scripts": 
   "test": "jest"
   ,
  "repository": 
  "type": "git",
  "url": ""
 ,
 "author": "",
 "license": "ISC",
 "bugs": 
 "url": ""
,
 "homepage": "",
 "devDependencies": 
 "babel-cli": "^6.26.0",
 "babel-core": "^6.26.0",
 "babel-jest": "^21.2.0",
 "babel-polyfill": "^6.26.0",
 "babel-preset-es2017": "^6.24.1",
 "jest": "^21.2.1"
 

并且知道当我输入 npm test 以开玩笑地运行我的所有测试时，我得到了这些错误：

 )import StateList from './StateList';

   ^^^^^^
  SyntaxError: Unexpected token import

这意味着它不知道import，我在SF上搜索但没有任何解决方案解决我的问题

【参考方案1】：

babel-preset-es2017 不会转换 import 语句，因为它只包含插件：syntax-trailing-function-commas 和 transform-async-to-generator.

在安装 babel-preset-es2017 时，您还会收到一条警告，指出它已被弃用，取而代之的是 babel-preset-env，其中包含 es201x 预设所包含的所有内容等等。

warning babel-preset-es2017@6.24.1: ?  Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io/env to update!

如Migration guide from es2015 to env所示，是一个drop-in替换。

npm install --save-dev babel-preset-env

并将您的 .babelrc 更改为：

  "presets": ["env"]

不要将babel-preset-env 与Babel's env option 混淆，我已从您当前的配置中删除了它，因为您对test 环境使用与其他任何环境完全相同的预设，因此它没有任何效果.

您可以将babel-preset-env 配置为仅转换您的目标平台不支持的功能，例如 "targets": "node": "current" 将仅转换您运行的节点版本不支持的功能。如果没有指定目标，它将改变一切。详情见Env preset documentation。

注意：随着即将发布的 Babel 7 版本，官方包将发布在命名空间@babel 下，这意味着babel-preset-env 将是@babel/preset-env。

【讨论】：

最后一个链接是 404

当我添加 "targets": "node": "current" 然后我得到错误：invalid option base.targets