在 webpack.config.js 中使用擴展運算符的 SyntaxError

Question

在我的 webpack.config.js 中，我從其他文件中導入了幾個用於配置的 JS 對象。 這些對象是使用擴展運算符組成的。 前任。 在 build.js 中

const otherObj = { a:[], b: [] }
const conf = {
  prop1: [],
  ...otherObj
}

然后我想以這種方式在 webpack.config.js 中使用這些對象：

const { prop1, a, b } = require('./build.js');
module.exports = {
    entry: { prop1, a, b },
    rules: [
      {
        test: jsRegex,
        exclude: /node_modules/,
        use: ["babel-loader"]
      },
    ]
}

當我啟動構建腳本時，我收到一個 SyntaxError：

    ...otherObj,
^^^
SyntaxError: Unexpected token ...

注意：這里遵循 .babelrc

    {
    "presets": [
        "@babel/preset-env"
    ],
    "plugins": [
        "@babel/syntax-object-rest-spread"
    ] 
}

Answer 1

這取決於您使用的node版本。 例如，使用 node v6.15.1 (Boron) 將返回與您相同的錯誤，但在v8.14.0 (Carbon) 上運行時，它編譯得很好。

使用節點

檢查您使用的節點版本是否支持您需要的功能。

您正在使用的對象擴展屬性的功能已添加到v8.6.0 （無標志的運行節點）。

使用巴別塔

您可以轉譯您的 webpack 配置，這樣您就可以使用當前的節點版本並使用您可能喜歡的所有 ES6 功能。

Answer 2

你應該像下面這樣添加 .babelrc 文件。

然后安裝： npm i babel-plugin-transform-object-rest-spread

{
    "presets": ["env", "react"],
    "plugins": ["transform-object-rest-spread"]

}

這對我有用，試試吧！