Javascript Nodejs5 和 babel 中的“意外令牌导入”？

"unexpected token import" in Nodejs5 and babel?

提问by jovi

In js file, i used import to instead of require

在 js 文件中，我使用 import to 而不是 require

import co from 'co';

And tried to run it directly by nodejs since it said import is 'shipping features' and support without any runtime flag (https://nodejs.org/en/docs/es6/), but i got an error

并尝试通过 nodejs 直接运行它，因为它说导入是“运输功能”并且支持没有任何运行时标志（https://nodejs.org/en/docs/es6/），但我收到一个错误

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

SyntaxError: Unexpected token import

Then i tried to use babel

然后我尝试使用 babel

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

and run by

并运行

babel-node js.js

still got same error, unexpected token import?

仍然有同样的错误，意外的令牌导入？

How could I get rid of it?

我怎么能摆脱它？

回答by Laurence Bortfeld

From the babel 6 Release notes:

来自 babel 6 发行说明：

Since Babel is focusing on being a platform for JavaScript tooling and not an ES2015 transpiler, we've decided to make all of the plugins opt-in. This means when you install Babel it will no longer transpile your ES2015 code by default.

由于 Babel 专注于成为 JavaScript 工具平台而不是 ES2015 转译器，我们决定让所有插件都选择加入。这意味着当您安装 Babel 时，默认情况下它将不再转译您的 ES2015 代码。

In my setup I installed the es2015 preset

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

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

or with yarn

或用纱线

yarn add babel-preset-es2015 --dev

and enabled the preset in my .babelrc

并在我的 .babelrc 中启用预设

{
  "presets": ["es2015"]
}

回答by vincent mathew

Until modules are implemented you can use the Babel "transpiler" to run your code:

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

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

and then

进而

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

If you dont want to type --presets node6you can save it .babelrc file by:

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

{
  "presets": [
    "node6"
  ]
}

See https://www.npmjs.com/package/babel-preset-node6and https://babeljs.io/docs/usage/cli/

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

回答by Adiono

1. Install packages: babel-core, babel-polyfill, babel-preset-es2015
2. Create .babelrcwith contents: { "presets": ["es2015"] }
3. Do not put importstatement in your main entry file, use another file eg: app.jsand your main entry file should required babel-core/registerand babel-polyfillto make babel works separately at the first place before anything else. Then you can require app.jswhere importstatement.

1. 安装软件包：babel-core, babel-polyfill,babel-preset-es2015
2. 创建.babelrc内容：{ "presets": ["es2015"] }
3. 不要把import语句放在你的主入口文件中，使用另一个文件，例如：app.js你的主入口文件应该是必需的，babel-core/register并且babel-polyfill首先让 babel 在其他任何事情之前单独工作。然后你可以要求app.jswhereimport语句。

Example:

例子：

index.js

索引.js

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

app.js

应用程序.js

import co from 'co';

It should works with node index.js.

它应该与node index.js.

回答by kristina

babel-preset-es2015is now deprecated and you'll get a warning if you try to use Laurence's solution.

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

To get this working with Babel 6.24.1+, use babel-preset-envinstead:

要使其与 Babel 6.24.1+ 一起使用，请babel-preset-env改用：

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

Then add envto your presets in your .babelrc:

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

{
  "presets": ["env"]
}

See the Babel docsfor more info.

有关更多信息，请参阅Babel 文档。

回答by jde-chil

if you use the preset for react-native it accepts the import

如果您使用 react-native 的预设，它会接受导入

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

and put it inside your .babelrc file

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

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

in your project root directory

在您的项目根目录中

https://www.npmjs.com/package/babel-preset-react-native

https://www.npmjs.com/package/babel-preset-react-native

回答by Isaac Sekamatte

Current method is to use:

目前的方法是使用：

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

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

And then in in .babelrc

然后在 .babelrc

{
    "presets": ["env"]
}

this install Babel support for latest version of js (es2015 and beyond) Check out babeljs

此安装 Babel 支持最新版本的 js（es2015 及更高版本）查看 babeljs

Do not forget to add babel-nodeto your scripts inside package.jsonuse when running your js file as follows.

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

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

Now you can npm populate yourfile.jsinside terminal.

现在您可以npm populate yourfile.js在终端内。

If you are running windows and running error internal or external command not recognized, use node infront of the script as follow

如果您正在运行 Windows 并且运行错误内部或外部命令无法识别，请使用脚本前面的节点，如下所示

node node_modules/babel-cli/bin/babel-node.js

node node_modules/babel-cli/bin/babel-node.js

Then npm run populate

然后 npm run populate

回答by MarbinJavier

It may be that you're running uncompiled files. Let's start clean!

可能是您正在运行未编译的文件。让我们开始清洁吧！

In your work directory create:

在您的工作目录中创建：

• 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'.

• 两个文件夹。一种用于预编译的 es2015 代码。另一个用于 babel 的输出。我们将它们分别命名为“src”和“lib”。

• 具有以下对象的 package.json 文件：

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

• 一个名为“.babelrc”的文件，包含以下说明： {"presets": ["latest"]}

• 最后，在 src/index.js 文件中编写测试代码。在你的情况下： import co from 'co'.

Through your console:

通过您的控制台：

• Install your packages: npm install
• Transpile your source directory to your output directory with the -d (aka --out-dir) flag as, already, specified in our package.json: npm run transpile-es2015
• Run your code from the output directory! node lib/index.js

• 安装你的软件包： npm install
• 使用我们的 package.json 中已经指定的 -d（又名 --out-dir）标志将您的源目录转换为您的输出目录： npm run transpile-es2015
• 从输出目录运行您的代码！ node lib/index.js

回答by Priyanshu Chauhan

You have to use babel-preset-envand nodemonfor hot-reload.

您必须使用babel-preset-env和nodemon进行热重载。

Then create .babelrc file with below content:

然后创建具有以下内容的 .babelrc 文件：

{
  "presets": ["env"]
}

Finally, create script in package.json:

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

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

Or just use this boilerplate:

或者只是使用这个样板：

Boilerplate: node-es6

样板：node-es6

回答by lior ben yosef

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

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

next in package.json file add in scripts "start": "babel-node server.js"

接下来在 package.json 文件中添加脚本 “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"
}

and create file for babel , in root ".babelrc"

并在根目录“.babelrc”中为 babel 创建文件

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

and run npm start in terminal

并在终端中运行 npm start

回答by KARTHIKEYAN.A

Involve following steps to resolve the issue:

涉及以下步骤来解决问题：

1) Install the CLI and env preset

1) 安装CLI 和 env 预设

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

2) Create a .babelrcfile

2) 创建一个.babelrc文件

{
  "presets": ["env"]
}

3) configure npm start in package.json

3) 在package.json 中配置 npm start

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

4) then start app

4）然后启动应用程序

$ npm start