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

Question

我尝试在我的项目中使用Jest和bablejs以及ES2017,根据Jest Getting Started页面以及ES2017的Bablejs配置这是我的.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以使用jest运行我的所有测试时我得到以下错误:

 ){import StateList from './StateList';

   ^^^^^^
  SyntaxError: Unexpected token import

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

Answer 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!

如从es2015到env的迁移指南中所示,它是替代品.

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

并将你.babelrc改为:

{
  "presets": ["env"]
}

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

您可以配置babel-preset-env为仅转换您所定位的平台不支持的功能,例如,{ "targets": { "node": "current" } }仅转换您正在运行的Node版本不支持的功能.如果没有指定目标,它将转换所有内容.有关详细信息,请参阅Env预设文档.

注意:随着即将推出的Babel版本7,官方软件包将在命名空间下发布@babel,这意味着babel-preset-env将会发布@babel/preset-env.