Question

我在index.js中有这个

import express from 'express'
import data from './data/data'


const app = express();
const PORT = 3000; 

app.listen(PORT, () =>
    console.log(`Your server is running on ${PORT}`)
);

这是我的package.json

{
    "name": "express-app",
    "version": "1.0.0",
    "description": "backend provisioning",
    "main": "app.js",
    "scripts": {
        "start": "nodemon ./index.js --exec babel-node -e js"
    },
    "author": "B",
    "license": "ISC",
    "devDependencies": {
        "babel-cli": "^6.26.0",
        "babel-preset-env": "^1.6.1",
        "babel-preset-stage-0": "^6.24.1"
    },
    "dependencies": {
        "express": "^4.16.3"
    }
}

当我运行nodemon时，我得到了

[nodemon] 1.17.3
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting `node index.js`
/Users/b/Desktop/express-app/index.js:1
(function (exports, require, module, __filename, __dirname) { import express from 'express'
                                                            ^^^^^^

SyntaxError: Unexpected token import
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:607:28)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)
    at Function.Module.runMain (module.js:684:10)
    at startup (bootstrap_node.js:187:16)
    at bootstrap_node.js:608:3
[nodemon] app crashed - waiting for file changes before starting...

我忘了做任何事情才能使用导入命令吗？

我这样做了：

npm install --save-dev babel-cli babel-preset-env babel-preset-stage-0
npm install express
nodemon

相同的结果

我也试试这个

rm -rf node_modules/
npm install
nodemon

相同的结果

.babelrc

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

Answer 1

NodeJS仅支持import本地experimentally，并且仅当您的脚本具有.mjs扩展名时才支持。

这就是为什么package.json中的start指的是babel-node，它在运行之前将ES6代码转换为经典的JS。但我怀疑这个命令是否会起作用，因为你没有将任何预设传递给babel来运行脚本。试试这个命令：

nodemon --exec babel-node --presets env index.js

[OR]

将文件重命名为.mjs扩展名，然后运行：

nodemon --experimental-modules index.mjs

Answer 2

如果您的节点版本较低，则会发生这种情况。请至少将其升级到v10.0

Answer 3

我只想概述一下造成这种情况的人，因为它非常痛苦。首先，在ES6中，不一起支持 import Express 或 require express ，尽管如此，我们可以通过 esm 或 dynamic来实现它-babel

原因是什么，詹姆斯在这里Update on ES6

解释

及其原因Node.js, TC-39, and Modules

在我的情况下，我已经在同一项目中使用import和require，并且我还需要调试和热重载功能，因此我对这个错误提出了质疑并找到了解决方法。首先，我决定在我的 package.json 中使用nodemon进行调试和热重装如下所示：

"debug-api": "nodemon --inspect -r esm src/api/server/index.js",
"debug-store": "nodemon --inspect -r esm dist/store/server/index.js",
"debug": "concurrently npm:debug-*" // if you add --source-maps to here it will make HMR

我已经删除了.babelrc文件，并且在如下所示的webpack中仅在一个位置定义了加载程序

            use: {
                loader: 'babel-loader',
                options: {
                    presets: ["@babel/react", ["@babel/preset-env", {
                        "useBuiltIns": "usage",
                        "shippedProposals": true,
                        "debug": true,
                        "include": ["es7.promise.finally", "es7.symbol.async-iterator", "es6.array.sort"],
                        "modules": false,     
                      }]
                    ],
                    plugins: [
                        ["@babel/plugin-transform-regenerator", {
                            "asyncGenerators": true,
                            "generators": true,
                            "async": true
                          }],
                            [
                                "@babel/plugin-transform-runtime",
                                {
                                  "corejs": false,
                                  "helpers": true,
                                  "regenerator": true,
                                  "useESModules": true
                                }
                              ],
                              "@babel/plugin-proposal-class-properties",
                              "@babel/plugin-syntax-dynamic-import",
                              "@babel/plugin-syntax-object-rest-spread",
                              "react-hot-loader/babel"]
                }
            }
        },

然后在和我可以从vscode调试控制台 launch.json 进行如下操作

    {
      "type": "node",
      "request": "attach",
      "name": "Node: Nodemon",
      "processId": "${command:PickProcess}",
      "restart": true,
      "protocol": "inspector",
  },

现在它已在进行调试和热重装，如果有问题或功能被忽略，请发表评论

Answer 4

使用require而不是import。这可能会有所帮助例如：写这个：

const express =  require('express')

代替：

import express from 'express'

Answer 5

最好使用

const express = require('express');

代替

import express from 'express';

SyntaxError：意外的令牌导入 - Express

5 个答案: