Javascript ./index.js 模块构建失败：语法错误：意外令牌
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/34614812/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
提示：将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间：2020-08-23 16:38:15 来源:igfitidea点击:
ERROR in ./index.js Module build failed: SyntaxError: Unexpected token
提问by phongyewtong
Have been trying to figure out what wrong with my setup or code, trying to do redux main website counter examples but there is error on the provider in the index.js file?
一直试图找出我的设置或代码有什么问题，尝试做 redux 主网站计数器示例，但 index.js 文件中的提供程序有错误？
Can anyone help me on this? Thanks!
谁可以帮我这个事？谢谢！
Phongs-MacBook-Pro:counter2 phongyewtong$ npm start
> [email protected] start /Users/phongyewtong/Desktop/counter2
> node server.js
==> Listening on port 3000. Open up http://localhost:3000/ in your browser.
webpack built 7971049e2b70cfeba9b5 in 502ms
Hash: 7971049e2b70cfeba9b5
Version: webpack 1.12.9
Time: 502ms
Asset Size Chunks Chunk Names
bundle.js 45.2 kB 0 main
chunk {0} bundle.js (main) 7.79 kB [rendered]
[0] multi main 40 bytes {0} [built] [1 error]
[1] (webpack)-hot-middleware/client-overlay.js 1.01 kB {0} [built]
[2] (webpack)-hot-middleware/client.js 3.24 kB {0} [built]
[3] (webpack)-hot-middleware/~/ansi-regex/index.js 145 bytes {0} [built]
[4] (webpack)-hot-middleware/~/strip-ansi/index.js 161 bytes {0} [built]
[5] (webpack)-hot-middleware/process-update.js 2.95 kB {0} [built]
[6] (webpack)/buildin/module.js 251 bytes {0} [built]
ERROR in ./index.js
Module build failed: SyntaxError: /Users/phongyewtong/Desktop/counter2/index.js: Unexpected token (10:2)
8 |
9 | render(
> 10 | <Provider store={store}>
| ^
11 | <App />
12 | </Provider>,
13 | document.getElementById('root')
at Parser.pp.raise (/Users/phongyewtong/Desktop/counter2/node_modules/babylon/lib/parser/location.js:22:13)
at Parser.pp.unexpected (/Users/phongyewtong/Desktop/counter2/node_modules/babylon/lib/parser/util.js:91:8)
at Parser.pp.parseExprAtom (/Users/phongyewtong/Desktop/counter2/node_modules/babylon/lib/parser/expression.js:510:12)
at Parser.pp.parseExprSubscripts (/Users/phongyewtong/Desktop/counter2/node_modules/babylon/lib/parser/expression.js:265:19)
at Parser.pp.parseMaybeUnary (/Users/phongyewtong/Desktop/counter2/node_modules/babylon/lib/parser/expression.js:245:19)
at Parser.pp.parseExprOps (/Users/phongyewtong/Desktop/counter2/node_modules/babylon/lib/parser/expression.js:176:19)
at Parser.pp.parseMaybeConditional (/Users/phongyewtong/Desktop/counter2/node_modules/babylon/lib/parser/expression.js:158:19)
at Parser.pp.parseMaybeAssign (/Users/phongyewtong/Desktop/counter2/node_modules/babylon/lib/parser/expression.js:121:19)
at Parser.pp.parseExprListItem (/Users/phongyewtong/Desktop/counter2/node_modules/babylon/lib/parser/expression.js:988:16)
at Parser.pp.parseCallExpressionArguments (/Users/phongyewtong/Desktop/counter2/node_modules/babylon/lib/parser/expression.js:341:20)
@ multi main
package.json
包.json
{
"name": "counter",
"version": "1.0.0",
"description": "",
"scripts": {
"start": "node server.js"
},
"author": "",
"license": "ISC",
"dependencies": {
"react": "^0.14.5",
"react-dom": "^0.14.5",
"react-redux": "^4.0.6",
"redux": "^3.0.5",
"redux-thunk": "^1.0.3"
},
"devDependencies": {
"babel-core": "^6.3.26",
"babel-loader": "^6.2.0",
"babel-plugin-react-transform": "^2.0.0",
"babel-preset-es2015": "^6.3.13",
"babel-preset-react": "^6.3.13",
"expect": "^1.13.4",
"express": "^4.13.3",
"jsdom": "^7.2.2",
"mocha": "^2.3.4",
"node-libs-browser": "^0.5.3",
"react-addons-test-utils": "^0.14.5",
"react-transform-hmr": "^1.0.1",
"webpack": "^1.12.9",
"webpack-dev-middleware": "^1.4.0",
"webpack-hot-middleware": "^2.6.0"
}
}
webpack.config.js
webpack.config.js
var path = require('path')
var webpack = require('webpack')
module.exports = {
devtool: 'cheap-module-eval-source-map',
entry: [
'webpack-hot-middleware/client',
'./index'
],
output: {
path: path.join(__dirname, 'dist'),
filename: 'bundle.js',
publicPath: '/static/'
},
plugins: [
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin()
],
module: {
loaders: [
{
test: /\.js$/,
loaders: [ 'babel' ],
exclude: /node_modules/,
include: __dirname
}
]
}
}
// When inside Redux repo, prefer src to compiled version.
// You can safely delete these lines in your project.
var reduxSrc = path.join(__dirname, '..', '..', 'src')
var reduxNodeModules = path.join(__dirname, '..', '..', 'node_modules')
var fs = require('fs')
if (fs.existsSync(reduxSrc) && fs.existsSync(reduxNodeModules)) {
// Resolve Redux to source
module.exports.resolve = { alias: { 'redux': reduxSrc } }
// Compile Redux from source
module.exports.module.loaders.push({
test: /\.js$/,
loaders: [ 'babel' ],
include: reduxSrc
})
}
回答by Kreozot
You must specify babel presets. You can use .babelrc
您必须指定 babel 预设。您可以使用.babelrc
{
"presets": [
"react",
"es2015"
]
}
or you can specify it in your loader query:
或者您可以在加载程序查询中指定它：
loaders: [ 'babel?presets[]=react,presets[]=es2015' ]
