javascript - 无法启动 Node 应用程序(server.js，可能是 Babel 问题？)

Question

我正在尝试让我的 Node 应用程序通过 npm start 启动。该应用程序在启动时崩溃，我不知道为什么。我对 Node 和全栈的所有东西都很陌生。有人能明白发生了什么吗？

当我运行 npm start --verbose 时，我得到这个:

hunterhawley@hunter-test:~$ npm start --verbose
npm info it worked if it ends with ok
npm verb cli [ '/home/hunterhawley/.nvm/versions/node/v11.10.1/bin/node',
npm verb cli   '/home/hunterhawley/.nvm/versions/node/v11.10.1/bin/npm',
npm verb cli   'start',
npm verb cli   '--verbose' ]
npm info using npm@6.7.0
npm info using node@v11.10.1
npm verb config Skipping project config: /home/hunterhawley/.npmrc. (matches userconfig)
npm verb run-script [ 'prestart', 'start', 'poststart' ]
npm info lifecycle mern-starter@2.0.0~prestart: mern-starter@2.0.0
npm info lifecycle mern-starter@2.0.0~start: mern-starter@2.0.0

> mern-starter@2.0.0 start /home/hunterhawley
> cross-env BABEL_DISABLE_CACHE=1 NODE_ENV=development nodemon index.js

[nodemon] 1.17.5
[nodemon] reading config ./nodemon.json
[nodemon] to restart at any time, enter `rs`
[nodemon] or send SIGHUP to 31462 to restart
[nodemon] ignoring: .git node_modules/**/node_modules
[nodemon] watching: /home/hunterhawley/server/**/* Intl
[nodemon] watching extensions: js,json
[nodemon] starting `node index.js`
[nodemon] forking
[nodemon] child pid: 31475
[nodemon] watching 37 files
/home/hunterhawley/node_modules/babel-core/lib/transformation/file/index.js:558
      throw err;
      ^

SyntaxError: /home/hunterhawley/server/server.js: Unexpected token (164:8)
  162 |     const store = configureStore({
  163 |       app: {
> 164 |         ...initialAppState,
      |         ^
  165 |         user: { ...req.session.user },
  166 |       },
  167 |     });
    at Parser.pp$5.raise (/home/hunterhawley/node_modules/babylon/lib/index.js:4454:13)
    at Parser.pp.unexpected (/home/hunterhawley/node_modules/babylon/lib/index.js:1761:8)
    at Parser.pp$3.parseIdentifier (/home/hunterhawley/node_modules/babylon/lib/index.js:4332:10)
    at Parser.pp$3.parsePropertyName (/home/hunterhawley/node_modules/babylon/lib/index.js:4156:96)
    at Parser.pp$3.parseObj (/home/hunterhawley/node_modules/babylon/lib/index.js:4045:12)
    at Parser.pp$3.parseExprAtom (/home/hunterhawley/node_modules/babylon/lib/index.js:3719:19)
    at Parser.pp$3.parseExprSubscripts (/home/hunterhawley/node_modules/babylon/lib/index.js:3494:19)
    at Parser.pp$3.parseMaybeUnary (/home/hunterhawley/node_modules/babylon/lib/index.js:3474:19)
    at Parser.pp$3.parseExprOps (/home/hunterhawley/node_modules/babylon/lib/index.js:3404:19)
    at Parser.pp$3.parseMaybeConditional (/home/hunterhawley/node_modules/babylon/lib/index.js:3381:19)
[nodemon] app crashed - waiting for file changes before starting...

所以在我看来这是一个巴别塔问题。我可以附上我的 index.js 或任何其他文件，如果这可以帮助您解决这个问题。谢谢!

编辑:另外，我只是想补充一点，安装过程(尽管需要一些工作)进行得很顺利，并且我在另一个终端窗口中运行了 MongoDB，这对于这个应用程序来说是必需的。我也尝试过直接运行 Node index.js，但这也没有让我有任何进展。

编辑2:这是我安装答案1中给出的插件时得到的结果

npm WARN babel-plugin-webpack-loaders@0.9.0 requires a peer of webpack@>=1.12.9 <3.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN chunk-manifest-webpack-plugin@0.1.0 requires a peer of webpack@^1.4.0-beta6 but none is installed. You must install peer dependencies yourself.
npm WARN extract-text-webpack-plugin@1.0.1 requires a peer of webpack@^1.9.11 but none is installed. You must install peer dependencies yourself.
npm WARN webpack-dev-middleware@1.12.2 requires a peer of webpack@^1.0.0 || ^2.0.0 || ^3.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN webpack-dev-server@2.11.2 requires a peer of webpack@^2.2.0 || ^3.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN webpack-manifest-plugin@1.3.2 requires a peer of webpack@1 || 2 || 3 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-object-rest-spread@7.3.4 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-object-rest-spread@7.2.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN mern-starter@2.0.0 No repository field.

+ @babel/plugin-proposal-object-rest-spread@7.3.4
added 3 packages from 1 contributor and audited 20460 packages in 22.759s

编辑 3:添加我的 webpack.config.babel.js 文件

var cssnext = require('postcss-cssnext');
var postcssFocus = require('postcss-focus');
var postcssReporter = require('postcss-reporter');

var cssModulesIdentName = '[name]__[local]__[hash:base64:5]';
if (process.env.NODE_ENV === 'production') {
  cssModulesIdentName = '[hash:base64]';
}

module.exports = {
  output: {
    publicPath: '/',
    libraryTarget: 'commonjs2',
  },
  resolve: {
    extensions: ['', '.js', '.jsx'],
    modules: [
      'client',
      'node_modules',
    ],
  },
  module: {
    loaders: [
      {
        test: /\.css$/,
        exclude: /node_modules/,
        loader: 'style-loader!css-loader?localIdentName=' + cssModulesIdentName + '&modules&importLoaders=1&sourceMap!postcss-loader',
      },
      {
        test: /\.jpe?g$|\.gif$|\.png$|\.svg$/i,
        loader: 'url-loader?limit=10000',
      },
    ],
  },
  postcss: () => [
    postcssFocus(),
    cssnext({
      browsers: ['last 2 versions', 'IE > 10'],
    }),
    postcssReporter({
      clearMessages: true,
    }),
  ],
};

Answer 1

最简单的解决方案是更新到 Node v8.3 或更高版本...

“从 Node v8.3 开始，对象休息/传播无需任何转译即可使用。”

如果您使用 Babel 进行转译，正如您所提到的，那么您需要添加 a plugin对Object spread的polyfill支持。在您的 .babelrc 文件中添加...

"plugins": [
      "@babel/plugin-proposal-object-rest-spread"
]

显然你需要安装这个插件......

npm i -D @babel/plugin-proposal-object-rest-spread
//OR
yarn add @babel/plugin-proposal-object-rest-spread --dev

注意:这需要 "@babel/core": "^7.0.0"

以下是如何配置 .babelrc 文件以进行 Node 转译的示例...

  {
    "presets": [
        ["@babel/env", {
          "targets": {
            "node": "current"
          }
        }]
    ],
    "plugins": [
      "@babel/plugin-proposal-object-rest-spread",
      "@babel/plugin-proposal-class-properties"
    ]
  }

您还可以直接在 Webpack 配置中添加插件(webpack.config.babel.js)...

loaders: [
 {
  test: /\.js$/,
  exclude: /node_modules/,
  use: {
    loader: 'babel-loader',
    options: {
      presets: ['@babel/preset-env'],
      plugins: ['@babel/plugin-proposal-object-rest-spread']
    }
  }
 }
]

特定包的示例(在 package.json 中) 我目前在 Node/Babel 项目中使用，这可能有助于升级到 Babel ^7.0.0。 ..

"devDependencies": {
 "@babel/cli": "^7.2.3",
 "@babel/core": "^7.2.2",
 "@babel/plugin-proposal-object-rest-spread": "^7.3.1",
 "@babel/plugin-proposal-class-properties": "^7.3.4",
 "@babel/preset-env": "^7.3.1",
 "babel-core": "7.0.0-bridge.0",
 "babel-eslint": "^10.0.1",
 "babel-jest": "^24.0.0",
 "babel-loader": "^8.0.5",
 "babel-plugin-module-resolver": "^3.2.0"
}