Babel-Loader在运行npm run build时出现语法错误

Question

我对webpack不太熟悉，现在正试图将webpack从V3更新到V4，并且已成功更新了webpack配置，使其不再向我抛出depreciation错误，但我卡在了babel-loader的语法错误上。

      Module build failed (from ./node_modules/babel-loader/lib/index.js):
      /path/react/node_modules/schema-utils/dist/util/hints.js:16
      const currentSchema = { ...schema
      SyntaxError: Unexpected token ...

我的webpack配置文件中有这样的代码：

         test: /\.(js|jsx)$/,
            use: [
              {
                loader: 'babel-loader',
                options: {
                  presets: [
                    '@babel/preset-env',
                    '@babel/preset-react',
                    {
                      plugins: [
                        '@babel/plugin-proposal-class-properties'
                      ]
                    }
                  ],
                  compact: true,
                  cacheDirectory: false, // @todo: legacy option: true
                },
              }
            ]

我正在使用以下版本：

 "@babel/core": "^7.1.6",
 "@babel/plugin-proposal-class-properties": "^7.8.3",
 "@babel/preset-env": "^7.1.6",
 "@babel/preset-react": "^7.0.0",
 "babel-loader": "^8.0.4",

我已经尝试多次使用不同版本的 Babel，但始终遇到这条消息。有人能看到我犯的明显错误吗？

- Thomas Allen

Answer 1

SyntaxError: Unexpected token ... 意味着你的 node 没有转译 ES6。你是否已经升级了相对较新的 node/npm 版本？

此外，如果你正在更改版本，建议在再次运行 npm install 前删除你的 node_modules 文件夹和 package-lock.json 文件。

- Croot

---

谢谢，结果我使用的是相当古老的Node版本！接下来是下一个错误... - Thomas Allen

@Croot 但是 Babel 的工作不是将语法转换吗？而不是 Node 的工作？这不是因为 schema-util 是它自己的依赖关系，所以没有进行转译吗？ - user117829

也许 NodeJS 在 BabelJS 开始转译之前必须先解释 schema-utils（babel-loader 的依赖项）中的 ES6 语法？我认为我明白了，但有人可以确认一下吗？ - socrates

@user117829 较新版本的Node原生支持ES6，因此一些模块在从不支持该功能的旧版Node引用时可能会抛出上述错误。 - Croot