web-dev-qa-db-fra.com

SyntaxError: Importation de jeton inattendue - Express

J'ai ceci dans mon 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}`)
);

C'est mon 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"
    }
}

Quand je lance nodemon, je me suis 

[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...

Ai-je oublié de faire quelque chose pour pouvoir utiliser la commande d'importation? 

J'ai fait ça : 

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

même résultat 

J'essaye aussi ça 

rm -rf node_modules/
npm install
nodemon

même résultat 

.babelrc 

{
    "presets":[
        "env",
        "stage-0"
    ]
}
node.jsexpressecmascript-6
3
kyo

NodeJS prend en charge import de manière native uniquement à titre expérimental , et uniquement si votre script a l'extension .mjs.

C'est pourquoi la variable start de votre package.json fait référence à babel-node , qui transforme le code ES6 en JS classique à la volée avant de l'exécuter. Mais je doute même que cette commande fonctionne, car vous ne transmettez aucun préréglage à Babel pour exécuter le script. Essayez cette commande:

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

[OU]

Renommez votre fichier avec l'extension .mjs, puis lancez ceci:

nodemon --experimental-modules index.mjs

5
Vasan

Je veux juste donner un aperçu des personnes qui sont venues à cette situation, car elle est très pénible . Premièrement, dans ES6, il n’existe aucun support pour import Express ou require express ensemble et en dépit ceci nous pouvons le mettre en oeuvre avec esm ou babel-dynamique

Quelle est la raison, James a expliqué ici Mise à jour sur ES6

et la raison Node.js, TC-39 et modules

Dans mon cas, j’utilise l’import et le besoin dans le même projet et j’ai également besoin de fonctions de débogage et de rechargement à chaud, j’ai attaqué avec cette erreur et a trouvé un moyen. Tout d’abord, j’ai décidé d’utiliser nodemon pour le débogage et le rechargement à chaud dans mon package.json comme ci-dessous:

"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

j'ai supprimé le fichier .babelrc et j'ai défini les chargeurs sur un seul emplacement du Webpack, comme ci-dessous.

            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"]
                }
            }
        },

Et à la et je peux prendre le processus de la console de débogage de vscode, launch.json comme ci-dessous

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

Maintenant, il fonctionne avec le débogage et le rechargement à chaud. S'il y a un problème ou une fonctionnalité négligé, commentez

0
dewelloper