陣營的WebPack和巴貝爾配置問題

我使用的WebPack時收到此錯誤：陣營的WebPack和巴貝爾配置問題

ERROR in ./src/pages/clients/components/ClientProfile.js 
Module build failed: SyntaxError: Unexpected token (18:17) 

    16 |  } 
    17 | 
> 18 |  handleSubmit = (person) => { 
    |    ^
    19 |   console.log(person); 
    20 |  }; 
    21 |

我有以下.babelrc配置

{ 
    "presets" : ["es2015", "stage-3", "react"] 
}

這是我的devDependencies從package.json

"devDependencies": { 
    "babel-core": "^6.24.1", 
    "babel-loader": "^7.0.0", 
    "babel-preset-es2015": "^6.24.1", 
    "babel-preset-react": "^6.24.1", 
    "babel-preset-stage-3": "^6.24.1", 
    "react-scripts": "0.9.5", 
    "webpack": "^2.5.1", 
    "webpack-dev-server": "^2.4.5" 
    }, 
    "scripts": { 
    "start": "webpack-dev-server --info", 
    "build": "webpack", 
    "test": "react-scripts test --env=jsdom", 
    "eject": "react-scripts eject" 
    }

和webpack.config.js

module: { 
     loaders: [ 
      { 
       test: /\.js$/, 
       loader: 'babel-loader', 
       exclude: /node_modules/ 
      }, 
      { 
       test: /\.jsx$/, 
       loader: 'babel-loader', 
       exclude: /node_modules/ 
      }, 
      { 
       test: /\.css$/, 
       loader: 'style-loader!css-loader', 
       //include: /flexboxgrid/ 
      } 
     ] 
    }

我想不通爲什麼它沒有在這句法

handleSubmit = (person) => { 
     console.log(person); 
    };

是否有人有想法？謝謝。

來源

2017-05-09 comprex

The proposal to add class fields to the language目前處於標準化過程的第2階段。

巴別塔「舞臺」預置工作，像這樣：

babel-preset-stage-0只包含什麼需要支持階段0的功能。
babel-preset-stage-1包含支持階段0 和 1功能所需的功能。
依此類推，最多babel-preset-stage-4。

因此，由於您只有babel-preset-stage-3，所以不能使用類字段。爲了使它起作用，您應該卸載該軟件包，安裝babel-preset-stage-2，然後相應地更新您的配置文件。

有關TC39標準化過程的不同階段所涉及的詳細信息，請參閱GitHub和process document。

來源

2017-05-09 13:21:49

我在你的代碼中做了如下修改，它工作正常。

{ 
"babel-core": "^6.6.5", 
"babel-loader": "^6.2.4", 
"babel-plugin-transform-runtime": "^6.6.0", 
"babel-preset-es2015-native-modules": "^6.6.0", 
"babel-preset-react": "^6.5.0", 
"babel-preset-stage-0": "^6.5.0", //instead of preset-stage-3 
}

和

{ 
    "presets": [ 
    "es2015", 
    "react", 
    "stage-0" //instead of "stage-3" 
    ]

}

我會閱讀文檔，並拿出的原因，直到別人解釋它。 :)

來源

2017-05-09 12:48:58 user3770494

陣營的WebPack和巴貝爾配置問題

回答

相關問題