Unerwartetes reserviertes Wort: import - Webpack, Babel, Knoten, Reagieren

Question

Nachdem ich SSR zu meiner App hinzugefügt hatte, benutzte ich etwas ES6 in der Datei index.js meines Servers, und jetzt habe ich ein Problem, dass es ausgeführt wird Heroku wieder.

Ich habe viele Nachforschungen angestellt und verstehe, dass die Verwendung von ES6 erfordert, dass babel die Server-Datei transpiliert, aber so ziemlich alle Empfehlungen, die ich finden kann, führten dazu, dass die .babelrc-Datei benötigt wurde. aber von dem, was ich sagen kann, habe ich das schon getan.

Ich finde, dass je mehr ich versuche, dies zu beheben, desto verwirrter bin ich immer, so wollte ich hier erreichen, für einige Diskussion :) Dank jeder (Full-Code: https://github.com/trm313/mern-boiler)

Heroku Fehler

2017-05-08T14:35:04.470656+00:00 app[web.1]: [32m[nodemon] starting `babel-node index.js --presets react,es2015`[39m 
2017-05-08T14:35:04.545063+00:00 app[web.1]: You have mistakenly installed the `babel` package, which is a no-op in Babel 6. 
2017-05-08T14:35:04.545069+00:00 app[web.1]: Babel's CLI commands have been moved from the `babel` package to the `babel-cli` package. 
2017-05-08T14:35:04.545070+00:00 app[web.1]: 
2017-05-08T14:35:04.545071+00:00 app[web.1]:  npm uninstall -g babel 
2017-05-08T14:35:04.545072+00:00 app[web.1]:  npm install --save-dev babel-cli 
2017-05-08T14:35:04.545072+00:00 app[web.1]: 
2017-05-08T14:35:04.545073+00:00 app[web.1]: See http://babeljs.io/docs/usage/cli/ for setup instructions. 
2017-05-08T14:35:04.554946+00:00 app[web.1]: [31m[nodemon] app crashed - waiting for file changes before starting...[39m 

der folgenden Skripte "NPM Start ausführen" funktioniert lokal in Ordnung, aber nicht, wenn sie Heroku hochgeladen. Es beschwert sich, dass ich die 'babel-cli' Paket anstelle von 'babel' verwenden müssen, die ich bereits tue .. (Das Gleiche gilt für "Start-dev")

package.json

{ 
    "name": "react-authentication", 
    "version": "1.0.0", 
    "engines": { 
    "node": "4.4.3", 
    "npm": "4.2.0" 
    }, 
    "description": "", 
    "main": "index.js", 
    "scripts": { 
    "dev": "nodemon --use-strict index.js", 
    "bundle": "webpack", 
    "start-old": "node index.js", 
    "postinstall": "webpack -p", 
    "start-dev": "babel-node index.js --presets react,es2015", 
    "start": "nodemon index.js --exec babel-node --presets react,es2015", 
    "build": "babel lib -d dist --presets react,es2015", 
    "serve": "node dist/index.js", 
    "prod": "NODE_ENV=production node index.js" 
    }, 
    "keywords": [], 
    "author": "", 
    "license": "ISC", 
    "dependencies": { 
    "axios": "^0.15.3", 
    "babel-cli": "^6.24.1", 
    "babel-core": "^6.23.1", 
    "babel-loader": "^6.3.2", 
    "babel-preset-es2015": "^6.22.0", 
    "babel-preset-react": "^6.23.0", 
    "babel-register": "^6.24.1", 
    "bcryptjs": "^2.4.3", 
    "body-parser": "^1.16.1", 
    "client-sessions": "^0.7.0", 
    "cookie-parser": "^1.4.3", 
    "express": "^4.14.1", 
    "express-session": "^1.15.1", 
    "fs": "0.0.1-security", 
    "jsonwebtoken": "^7.3.0", 
    "material-ui": "^0.17.0", 
    "mongoose": "^4.8.3", 
    "nodemon": "^1.11.0", 
    "passport": "^0.3.2", 
    "passport-facebook": "^2.1.1", 
    "passport-local": "^1.0.0", 
    "path": "^0.12.7", 
    "react": "^15.4.2", 
    "react-dom": "^15.4.2", 
    "react-redux": "^5.0.3", 
    "react-router": "^3.0.2", 
    "react-tap-event-plugin": "^2.0.1", 
    "redux": "^3.6.0", 
    "redux-promise": "^0.5.3", 
    "redux-thunk": "^2.2.0", 
    "validator": "^6.2.1", 
    "webpack": "^2.2.1" 
    }, 
    "devDependencies": { 
    "babel-core": "^6.24.1", 
    "babel-loader": "^6.4.1", 
    "babel-preset-es2015": "^6.24.1", 
    "babel-preset-react": "^6.24.1", 
    "babel-preset-stage-0": "^6.24.1", 
    "nodemon": "^1.11.0", 
    "webpack": "^2.2.1" 
    } 
} 

webpack.config.js

const path = require('path'); 
module.exports = { 
    // the entry file for the bundle 
    entry: path.join(__dirname, '/client/src/app.js'), 

    // the bundle file we will get in the result 
    output: { 
    path: path.join(__dirname, '/client/dist/js'), 
    filename: 'app.js', 
    }, 

    module: { 

    // apply loaders to files that meet given conditions 
    loaders: [{ 
     test: /\.js$/, 
     include: path.join(__dirname, '/client/src'), 
     loader: 'babel-loader', 
     query: { 
     presets: ["react", "es2015"] 
     } 
    }], 
    }, 
    resolve: { 
    extensions: ['.js', '.jsx'] 
    }, 
    // start Webpack in a watch mode, so Webpack will rebuild the bundle on changes 
    watch: false 
}; 

.babelrc

{ 
    "presets": ["react", "es2015"] 
} 

Answer 1

Versuchen Sie, das Startscript in "node server.js" anstelle von nodemon zu ändern.