在Nodejs5和babel中出现了"unexpected token import"的错误？

Question

在js文件中，我使用了import代替require。

import co from 'co';

由于它说 import 是“shipping features” 并支持没有任何运行时标志 (https://nodejs.org/en/docs/es6/)，我尝试直接通过 nodejs 运行它，但是出现了错误。

import co from 'co';
^^^^^^

SyntaxError: Unexpected token import

然后我尝试使用Babel

npm install -g babel-core
npm install -g babel-cli
npm install babel-core //install to babel locally, is it necessary?

并由...运行

babel-node js.js

我仍然遇到相同的错误，意外的import标记？

我该如何摆脱它？

- johugz

---

尽管链接问题的答案确实也回答了这个问题，但很难将这个问题视为那个问题的副本。无论如何，我很高兴在这里有这个问题，因为谷歌直接将我带到了这里，因为所描述的语法错误正好与我看到的相匹配。我真的很高兴OP发表了这篇文章，而不是搜索一个有些相关的问题，并恰好找到一个适合的答案。 - Scott Sauyet

这句话的意思是“这个命令修复了我的问题...”，具体翻译为“我使用npm i --save-dev babel-cli命令解决了我的问题...”。 - ChuckJHardy

我投票反对将此标记为重复，我认为这是一个独立的问题。 - T.W.R. Cole

这不是重复的。我想要发布的另一个解决方案是，确保你在.babelrc中有这个插件："transform-es2015-modules-commonjs"。 - Dan Dascalescu

重复是（应该）可以接受的，这是人类工作方式的重要部分。@ScottSauyet所说的是其中一个原因。不同的解释和观点是另一个原因。对我来说，整个“寻找重复”的行为感觉非常无益，因为我作为一名多年的常规访问者希望它能停止。 - Stijn de Witt

对于较新版本的React，请使用新的Babel模块：https://stackoverflow.com/a/53927497/6665568。它具有更好的错误消息和支持React的新功能。 - Natesh bhat

Answer 1

来自 Babel 6 发布说明：

由于 Babel 正在专注于成为 JavaScript 工具的平台，而不是 ES2015 转译器，因此我们决定使所有插件都需要选择启用。这意味着当您安装 Babel 时，默认情况下它将不再对您的 ES2015 代码进行转译。

在我的设置中，我安装了 es2015 预设。

npm install --save-dev babel-preset-es2015

或者使用纱线

yarn add babel-preset-es2015 --dev

并在我的 .babelrc 中启用了预设

{
  "presets": ["es2015"]
}

- user5539486

---

好的答案。不幸的是，您仍需要使用 require() 来引用 npm 包，不能使用 import 语句。 - Jagtesh Chadha

我使用babel-node以及es2015和react预设。出现了同样的错误。 - FuzzY

无法工作。是的，那是必需的，但它不能使导入工作。 - still_dreaming_1

对我来说，这只是一个简单的修复。我被困在隧道视野中，试图将一个React/Babel项目的代码适应到另一个ES5项目，并同时升级到ES6语法。在我的package.json文件的scripts中，我忘记用"babel-node run.js"替换"node run"。是的，我感到有点傻。 :) - joezen777

JS生态系统非常简单。 - Rodrigo

Answer 2

在模块实现之前，您可以使用Babel“转译器”来运行您的代码：

npm install --save babel-cli babel-preset-node6

然后

./node_modules/babel-cli/bin/babel-node.js --presets node6 ./your_script.js

如果您不想输入--presets node6，可以通过以下方式将其保存到.babelrc文件中：

{
  "presets": [
    "node6"
  ]
}

请见https://www.npmjs.com/package/babel-preset-node6和https://babeljs.io/docs/usage/cli/

- vincent mathew

---

Babel 的最新建议是使用 babel-preset-env，它会检测需要运行哪些 polyfills，而不是使用 babel-preset-node*。在 .babelrc 文件中，可以使用以下配置：{ "presets": [ ["env", { "targets": { "node": "current" } }] ] }。 - ronen

之后我开始收到错误信息（无法识别的令牌'<'）：server.js: ```Unexpected token (37:12) 35 | const initialState = store.getState(); 36 | const componentHTML = renderToString(

37 | <Provider store={store}> | ^ 38 | <RouterContext {...props} /> 39 | </Provider>, 40 | );```

- A. K.

Answer 3

1. 安装以下包：babel-core，babel-polyfill，babel-preset-es2015
2. 创建 .babelrc 文件，并写入如下内容：{ "presets": ["es2015"] }
3. 不要在您的主入口文件中放置 import 语句，使用另一个文件，例如： app.js。在任何其他事物之前，您的主入口文件应该要求使用babel-core/register和babel-polyfill来使babel首先可以独立工作。然后，您可以在需要 import 语句的地方，导入 app.js。

示例：

index.js

require('babel-core/register');
require('babel-polyfill');
require('./app');

app.js

import co from 'co';

它应该可以通过 node index.js 运行。

- Adiono

---

这是一个简单的解决方法，可用于开发。尽管在生产过程中，您应该始终编译您的es5代码。 - Jonas

等等...这是我想的那个吗？几个月前，我曾经梦想过JavaScript/Perl/任何语言可以通过在同一语言中对现有语言进行自定义额外解析而无需更新来扩展。这就是这里正在发生的事情吗？？？ - Dmytro

非常好的答案。但是在脚本中，你可以像下面这样写。这样你就可以在任何文件中使用。 "scripts": { "build": "babel src -d dist", "start": "node dist/index.js" } - gkarthiks

Answer 4

babel-preset-es2015现在已被弃用，如果您尝试使用Laurence的解决方案，将会收到警告。

要在Babel 6.24.1+中使其正常工作，请改用babel-preset-env：

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

然后在你的.babelrc中添加env到你的预设中：

{
  "presets": ["env"]
}

了解更多信息，请参见Babel文档。

- kristina

---

有没有使用CLI的方法来完成这个？ - jcollum

Answer 5

如果您使用React Native预设，它会接受引用。

npm i babel-preset-react-native --save-dev

并将其放入您的.babelrc文件中

{
  "presets": ["react-native"]
}

在您的项目根目录中，参考https://www.npmjs.com/package/babel-preset-react-native。

- jde-chil

Answer 6

目前的方法是使用：

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

然后在.babelrc中进行配置。

{
    "presets": ["env"]
}

这将为最新版本的js（es2015及以上）安装Babel支持。请查看babeljs。

在运行js文件时，请不要忘记将babel-node添加到package.json中的脚本中，如下所示。

"scripts": {
   "test": "mocha",
    //Add this line to your scripts
   "populate": "node_modules/babel-cli/bin/babel-node.js" 
},

现在，你可以在终端中使用npm populate yourfile.js。如果你正在运行 Windows 并且出现“内部或外部命令不被识别”的错误，请按照以下步骤在脚本前面加上 node： node node_modules/babel-cli/bin/babel-node.js，然后运行npm run populate。

- Isaac Sekamatte

Answer 7

可能是因为您正在运行未编译的文件。让我们从头开始！

在您的工作目录中创建：

• Two folders. One for precompiled es2015 code. The other for babel's output. We'll name them "src" and "lib" respectively.

• A package.json file with the following object:

  { 
    "scripts": {
        "transpile-es2015": "babel src -d lib"
    },
    "devDependencies": {
        "babel-cli": "^6.18.0",
        "babel-preset-latest": "^6.16.0"
    }
  }
  

• A file named ".babelrc" with the following instructions: {"presets": ["latest"]}

• Lastly, write test code in your src/index.js file. In your case: import co from 'co'.

通过你的控制台：

• 安装你的包：npm install
• 使用-d（也就是--out-dir）标志将源目录转译到输出目录，如我们的package.json中已经指定的那样：npm run transpile-es2015
• 从输出目录运行你的代码！node lib/index.js

- MarbinJavier

---

很遗憾，没有起作用。Unexpected token import。 - dipole_moment

请确保 babel 命令在您的搜索路径中。这是一个轻微的变化。package.json:{ "scripts": { "transpile": "./node_modules/.bin/babel src -d lib" }, "devDependencies": { "babel-cli": "^6.24.1", "babel-preset-env": "^1.6.0" } }.babelrc:{ "presets": ["env"] } - Maksim Yegorov

Answer 8

您需要使用 babel-preset-env 和 nodemon 实现热重载。

然后创建 .babelrc 文件，内容如下：

{
  "presets": ["env"]
}

最后，在package.json中创建脚本：

"scripts": {
    "babel-node": "babel-node --presets=env",
    "start": "nodemon --exec npm run babel-node -- ./index.js",
    "build": "babel src -d dist"
  }

或者使用这个样板：

样板：node-es6

该内容涉及IT技术，旨在提供一个样板链接。

- Priyanshu Chauhan

Answer 9

• 安装 --> "npm i --save-dev babel-cli babel-preset-es2015 babel-preset-stage-0"

接下来，在 package.json 文件中的 scripts 中添加 "start": "babel-node server.js"

    {
  "name": "node",
  "version": "1.0.0",
  "description": "",
  "main": "server.js",
  "dependencies": {
    "body-parser": "^1.18.2",
    "express": "^4.16.2",
    "lodash": "^4.17.4",
    "mongoose": "^5.0.1"
  },
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "babel-node server.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

在根目录下创建babel文件，命名为".babelrc"。

    {
    "presets":[
        "es2015",
        "stage-0"
    ]
}

并在终端中运行npm start

- lior ben yosef

Answer 10

解决问题需要执行以下步骤：

1）安装CLI和env预设

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

2) 创建一个.babelrc文件

{
  "presets": ["env"]
}

3) 在 package.json 中配置 npm start

"scripts": {
    "start": "babel-node ./server/app.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  }

4) 然后启动应用程序

$ npm start

- KARTHIKEYAN.A