無法使用webpack編譯react js文件

Question

我有一個包含該記錄的文件app.js

handlePageClick = (data) => {
    let selected = data.selected;
    let offset = Math.ceil(selected * this.props.perPage);
    this.setState({offset: offset}, () => {
        this.setState({data: items.slice(offset, offset + 10), pageCount: 20})
    });
};

我的webpack.config.js看起來像這樣

var path = require（'path'）; var node_dir = __dirname +'/ node_modules';

module.exports = {
    entry: './src/main/js/app.js',
    devtool: 'sourcemaps',
    cache: true,
    debug: true,
    output: {
        path: __dirname,
        filename: './src/main/resources/static/built/bundle.js'
    },
    module: {
        loaders: [
            {
                test: path.join(__dirname, '.'),
                exclude: /(node_modules)/,
                loader: 'babel-loader',
                query: {
                    cacheDirectory: true,
                    presets: ['es2015', 'react']
                }
            }
        ]
    }
};

我正在使用demo.js文件作為基礎進行細微調整。 我的package.json包含該依賴項

  "dependencies": {
    "react": "^16.0.0",
    "react-dom": "^16.0.0",
    "rest": "^1.3.1",
    "webpack": "^1.12.2",
    "react-paginate": "^5.0.0"
  },
  "scripts": {
    "watch": "webpack --watch -d"
  },
  "devDependencies": {
    "babel-core": "^6.18.2",
    "babel-loader": "^6.2.7",
    "babel-polyfill": "^6.16.0",
    "babel-preset-es2015": "^6.18.0",
    "babel-preset-react": "^6.16.0"
  }

但是當我嘗試啟動應用程序時，出現此錯誤

[INFO] Module build failed: SyntaxError: .../src/main/js/app.js: Unexpected token (36:20)
[INFO]
[INFO]   34 |     };
[INFO]   35 |
[INFO] > 36 |     handlePageClick = (data) => {
[INFO]      |                     ^
[INFO]   37 |         let selected = data.selected;
[INFO]   38 |         let offset = Math.ceil(selected * this.props.perPage);
[INFO]   39 |         this.setState({offset: offset}, () => {
[INFO]

問題是什么？ 庫版本錯誤？ 錯es ？

Answer 1

您需要babel-plugin-transform-class-properties