使用擴展運算符（...）與React和Redux

我正在與Redux構建一個反應應用程序。我有一個減速返回：使用擴展運算符（...）與React和Redux

const posts = (state={posts:[], search_criterion:''}, action) => { 
    switch (action.type) { 
    case 'SOME_EVENT': 
     return { 
     ...state, 
     search_criterion:action.search_criterion 
     } 
    default: 
     return state 
    } 
} 
export default posts

當我構建具有的WebPack，我得到：

Module build failed: SyntaxError: Unexpected token (x:y)

指向...。

有什麼想法？我究竟做錯了什麼？

webpack.config.js

const webpack = require('webpack'); 

module.exports = { 
    context: __dirname + "/app", 
    entry: { 
    javascript: "./app.js" 
    // ,html: "./index.html", 
    }, 

    output: { 
    filename: "app.js", 
    path: __dirname + "/server/js", 
    }, 

    module: { 
    loaders: [ 
     { 
     test: /\.js$/, 
     exclude: /node_modules/, 
     loader: 'babel-loader', 
     }, 
     { 
     test: /\.html$/, 
     loader: "file?name=[name].[ext]", 
     }, 
    ], 
    }, 

    //alient app settings settings 
    plugins: [ 
    new webpack.DefinePlugin({ 
     'process.env': { 
     'NODE_ENV': JSON.stringify('test'), 
     'APIHOST': JSON.stringify('http://localhost:8081'), 
     } 
    }) 
    ], 
}

的package.json

{ 
    "name": "react-project", 
    "version": "1.0.0", 
    "description": "", 
    "main": "app.js", 
    "private": true, 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1", 
    "build": "webpack --config ./webpack.config.js", 
    "start": "NODE_ENV=test APIHOST=http://localhost:8081 babel-node server/server.js --presets es2015,stage-2" 
    }, 
    "babel": { 
    "presets": [ 
     "es2015", 
     "react" 
    ] 
    }, 
    "author": "", 
    "license": "ISC", 
    "devDependencies": { 
    "axios": "^0.15.2", 
    "babel": "^6.5.2", 
    "babel-cli": "^6.18.0", 
    "babel-core": "^6.18.2", 
    "babel-loader": "^6.2.7", 
    "babel-preset-es2015": "^6.18.0", 
    "babel-preset-react": "^6.16.0", 
    "babel-preset-stage-2": "^6.18.0", 
    "body-parser": "^1.15.2", 
    "express": "^4.14.0", 
    "express-handlebars": "^3.0.0", 
    "express-session": "^1.14.2", 
    "file-loader": "^0.9.0", 
    "node-jsx": "^0.13.3", 
    "socket.io": "^1.5.1", 
    "uglify-js": "^2.7.4", 
    "webpack": "^1.13.3", 
    "webpack-dev-server": "^1.16.2" 
    }, 
    "dependencies": { 
    "react": "^15.4.0", 
    "react-dom": "^15.4.0", 
    "react-redux": "^4.4.6", 
    "redux": "^3.6.0", 
    "redux-logger": "^2.7.4", 
    "redux-thunk": "^2.1.0" 
    } 
}

來源

2016-11-21 ArkadyB

你可以包含你的'webpack.config.json'和'package.json'嗎？ – Aurora0001

您可能錯過了適合babel的正確預設集。 –

@ Aurora0001，加入 – ArkadyB

在你package.json添加stage-0下反應，就像這樣：

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

或者你可以只添加transform-object-rest-spread插件。

來源

2016-11-21 20:17:43

值得注意的是，你需要運行'npm install --save-dev babel-preset-stage-0'才能正常工作。 – Aurora0001

謝謝！有效。你能否解釋爲什麼0階段而不是2階段（第2階段的工作......）？ – ArkadyB

@ArkadyB'stage-3'也可以工作，因爲[它包含'transform-object-rest-spread']（https://babeljs.io/docs/plugins/preset-stage-3/）。我認爲這是個人喜好，爲什麼選擇了'0階段'。 – Aurora0001

使用擴展運算符（...）與React和Redux

回答

相關問題