Node.js-SyntaxError：予期しないトークンのインポート

何が悪いのか分かりません。ノードv5.6.0 NPM v3.10.6

コード：

function (exports, require, module, __filename, __dirname) {
    import express from 'express'
};

エラー：

SyntaxError: Unexpected token import
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:387:25)
    at Object.Module._extensions..js (module.js:422:10)
    at Module.load (module.js:357:32)
    at Function.Module._load (module.js:314:12)
    at Function.Module.runMain (module.js:447:10)
    at startup (node.js:140:18)
    at node.js:1001:3

更新3：ノード13以降、.mjs拡張子を使用するか、package.jsonで "type"： "module"を設定できます。あなたはしていない使用する必要が--experimental-modules旗を。

更新2：ノード12以降、次のいずれかを使用できます。.mjs拡張機能を"type": "module" package.jsonに設定ます。そして、--experimental-modulesフラグを付けてノードを実行する必要があります。

アップデート：ではノード9、それは旗の後ろに有効になっており、使用される.mjs拡張子を。

node --experimental-modules my-app.mjs

一方でimport、実際ES6の一部であり、それは残念ながらまだデフォルトでNodeJSでサポートされていません、そしてごく最近のブラウザでサポートして上陸しました。

参照してくださいMDNにテーブルcompatのブラウザをし、このノードの問題。

Node.jsのES6モジュールに関する James M Snellのアップデートから（2017年2月）から：

作業は進行中ですが、しばらく時間がかかります—現在、少なくとも1年程度は検討しています。

サポートがネイティブに現れるまでは、従来のrequireステートメントを引き続き使用する必要があります。

const express = require("express");

NodeJSでES6 / 7の新機能を本当に使用したい場合は、Babelを使用してコンパイルできます。サーバーの例を示します。

残念ながら、Node.jsはES6をサポートしていません importまだん。

あなたがしようとしていることを達成するには（Expressモジュールをインポートする）、このコードで十分です

var express = require("express");

また、実行してExpressがインストールされていることを確認してください

$ npm install express

Node.jsの学習の詳細については、Node.jsドキュメントをご覧ください。

他の回答で述べたように、Node JSは現在ES6インポートをサポートしていません。

（今のところ、EDIT 2を読んでください）

ノードjsでES6インポートを有効にするすると、この問題の解決策が提供さ。私はこれを試してみましたが、うまくいきました。

次のコマンドを実行します。

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

次に、新しいファイル（config.js）を作成し、それに次のコードを追加する必要があります。

    require('babel-register')({
        presets: [ 'env' ]
    })
    // Import the rest of our application.
    module.exports = require('./your_server_file.js')

これで、エラーが発生することなくインポートステートメントを記述できます。

お役に立てれば。

編集：

上記のコードで作成した新しいファイルを実行する必要があります。私の場合はそうだったconfig.js。だから私は実行する必要があります：

    node config.js

編集2：

実験中に、この問題の簡単な解決策が1つ見つかりました。

作成する .babelrcプロジェクトのルートにファイルをます。

以下を追加します（必要に応じて他のすべてのバベルプリセットをこのファイルに追加できます）。

    {
        "presets": ["env"]
    }

インストールbabel-preset-envコマンドを使用npm install babel-preset-env --saveして、インストールbabel-cliコマンドを使用してnpm install babel-cli -g --save

次に、サーバーまたはインデックスファイルが存在するフォルダーに移動し、次を使用して実行します：babel-node fileName.js

またはnpm start、次のコードをpackage.jsonファイルに追加して、を使用して実行できます。

    "scripts": {
        "start": "babel-node src/index.js"
    }

エラー： SyntaxError：予期しないトークンのインポートまたはSyntaxError：予期しないトークンのエクスポート

解決策：すべてのインポートを例として変更します

const express               = require('express');
const webpack               = require('webpack');
const path                  = require('path');
const config                = require('../webpack.config.dev');
const open                  = require('open');

そしてまたあなたexport default = foo;をmodule.exports = foo;

esm記載されていないのでショックです。この小さくても強力なパッケージでは、importまたはを使用できますrequire。

プロジェクトにESMをインストールする

$ npm install --save esm

esmを使用するようにノード起動スクリプトを更新します

node -r esm app.js

esmうまくいきます。私は時間のTONを無駄に.mjsして--experimental-modules唯一見つけるために.mjsファイルが使用するファイルをインポートすることはできませんrequireかmodule.exports。これは大きな問題でしたが、esm混ぜて一致させることができ、それを理解するだけで...うまくいきますesm。

それでも「インポート」を使用できない場合は、ここで私がそれをどのように処理したかを示します。ノードフレンドリーな要求に変換するだけです。例：

import { parse } from 'node-html-parser';

と同じです：

const parse = require('node-html-parser').parse;

Babel 7の提案で は、開発依存関係を追加できます

npm i -D @babel/core @babel/preset-env @babel/register

ルートに.babelrcを追加します

{
"presets": [
  [
    "@babel/preset-env",
    {
      "targets": {
        "node": "current"
     }
    }
  ]
 ]
}

.jsファイルに追加します

require("@babel/register")

または、cliで実行する場合は、requireフックを-r @ babel / registerとして使用できます。

$node -r @babel/register executeMyFileWithESModules.js

'babel'を使用できる場合は、次のようにpackage.json（-presets = es2015）にビルドスクリプトを追加してみてください。インポートコードをes2015にプリコンパイルする

"build": "babel server --out-dir build --presets=es2015 && webpack"

Node.js v12（およびこれはおそらく現在はかなり安定していますが、「実験的」とマークされています）以降、ESM（E CMA S cript）を使用するためのオプションがいくつかあります。 Mのファイルに対して（Node.jsの中odules）を、あります文字列を評価するための3番目の方法）、これはドキュメントが言うことです：

この--experimental-modulesフラグを使用して、ECMAScriptモジュール（ESモジュール）のサポートを有効にすることができます。

有効にすると、Node.jsはnode、初期入力として渡されたとき、またはによって参照されたときに、以下をESモジュールとして扱います import ESモジュールコード内のステートメントます。

• で終わるファイル .mjs。

• で終わるファイル.js、または拡張子のないファイル。最も近い親 package.jsonファイルに"type"値がのトップレベルフィールドが含まれている場合 "module"。

• --evalまたは--printに引数として渡された文字列、またはフラグを使用してnodevia STDINにパイプされた文字列 --input-type=module。

Node.jsは.js、最も近い親package.jsonファイルに最上位"type" フィールドが含まれていないファイルや、フラグのない文字列入力など、他のすべての入力形式をCommonJSとして扱います--input-type。この動作は、下位互換性を維持するためのものです。ただし、Node.jsがCommonJSモジュールとESモジュールの両方をサポートするようになったため、可能な限り明示的にすることをお勧めします。Node.jsはnode、初期入力として渡されるとき、またはimportESモジュールコード内のステートメントによって参照されるときに、以下をCommonJSとして扱います。

• で終わるファイル.cjs。

• で終わるファイル.js、または拡張子のないファイル。最も近い親 package.jsonファイルに"type"値がのトップレベルフィールドが含まれている場合 "commonjs"。

• --evalまたは--printに引数として渡された文字列、またはフラグを使用してnodevia STDINにパイプされた文字列 --input-type=commonjs。

私がエクスプレスで始めたときは常に代わりにインポートを使用するソリューションが必要でした

const express = require("express");
// to 
import express from "express"

多くの時間がこの行を通過します：- Unfortunately, Node.js doesn't support ES6's import yet.

他の人を助けるために、ここで新しい2つのソリューションを作成します

1）esm：-

見事にシンプル、バベルレス、バンドルレスのECMAScriptモジュールローダー。それを働かせましょう

  yarn add esm / npm install esm

start.jsを作成するか、名前空間を使用します

 require = require("esm")(module/*, options*/)
 // Import the rest of our application.
 module.exports = require('./src/server.js')
 // where server.js is express server start file

あなたの変更package.josnのパスパスstart.js

  "scripts": {
    "start": "node start.js",
    "start:dev": "nodemon start.js",
  },
  "dependencies": {
+    "esm": "^3.2.25",
  },
  "devDependencies": {
+   "nodemon": "^1.19.2"
  }

2）バベルjs：-

これは2つの部分に分割できます

a）timonweb.comによるソリューション1

b）ソリューション2

使用バベル6（古いバージョンのバベル・プリセット・ステージ3 ^ 6.0）を作成し.babelrc、あなたのルートフォルダにファイルを

{
    "presets": ["env", "stage-3"]
}

babel-preset-stage-3をインストールする

yarn add babel-cli babel-polyfill babel-preset-env bable-preset-stage-3 nodemon --dev

package.jsonの変更

"scripts": {
+   "start:dev": "nodemon --exec babel-node -- ./src/index.js",
+   "start": "npm run build && node ./build/index.js",
+   "build": "npm run clean && babel src -d build -s --source-maps --copy-files",
+   "clean": "rm -rf build && mkdir build"
},
"devDependencies": {
+    "babel-cli": "^6.26.0",
+    "babel-polyfill": "^6.26.0",
+    "babel-preset-env": "^1.7.0",
+    "babel-preset-stage-3": "^6.24.1",
+    "nodemon": "^1.19.4"
},

サーバーを起動する

yarn start / npm start

ああ、私たちは新しい問題を作成します

regeneratorRuntime.mark(function _callee(email, password) {
^
ReferenceError: regeneratorRuntime is not defined

このエラーは、コードでasync / awaitを使用した場合にのみ発生します。次に、カスタムのリジェネレータランタイムとcore-jsを含むポリフィルを使用します。上に追加index.js

import "babel-polyfill"

これにより、非同期/待機を使用できます

使用する Babel 7を

プロジェクトのすべてのものを最新にする必要があります。Babel7 .babelrcから始めましょう。

{
  "presets": ["@babel/preset-env"]
}

package.jsonの一部の変更

"scripts": {
+  "start:dev": "nodemon --exec babel-node -- ./src/index.js",
+  "start": "npm run build && node ./build/index.js",
+  "build": "npm run clean && babel src -d build -s --source-maps --copy-files",
+  "clean": "rm -rf build && mkdir build",
    ....
}
"devDependencies": {
+   "@babel/cli": "^7.0.0",
+   "@babel/core": "^7.6.4",
+   "@babel/node": "^7.0.0",
+   "@babel/polyfill": "^7.0.0",
+   "@babel/preset-env": "^7.0.0",
+   "nodemon": "^1.19.4"
....
}

import "@babel/polyfill"開始点で使用する

import "@babel/polyfill"
import express from 'express'
const app = express()

//GET request
app.get('/', async (req, res) {
  // await operation
  res.send('hello world')
})
app.listen(4000, () => console.log('🚀 Server listening on port 400!'))

なぜだと思いますか start:dev

真剣に。あなたが新しい人ならいい​​質問です。nodemonのyarn start:dev詳細については、毎回開始サーバーでイノシシを変更するたびに、開発サーバーとしてすべての変更再起動サーバーを自動的に使用します

私の場合、それは.babelrcファイルの世話をしており、次のようなものが含まれているはずです：

{
  "presets": ["es2015-node5", "stage-3"],
  "plugins": []
}