Javascript 尝试构建JSX时,Webpack抛出错误
这个问题有很多答案,所以我发誓我都试过了。我不确定配置设置有什么问题 在终端中运行webpack时出现的错误:Javascript 尝试构建JSX时,Webpack抛出错误,javascript,reactjs,webpack,babeljs,babel-loader,Javascript,Reactjs,Webpack,Babeljs,Babel Loader,这个问题有很多答案,所以我发誓我都试过了。我不确定配置设置有什么问题 在终端中运行webpack时出现的错误: ERROR in ./src/index.js 13:8 Module parse failed: Unexpected token (13:8) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. S
ERROR in ./src/index.js 13:8
Module parse failed: Unexpected token (13:8)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| // const store = createStore(reducers, {}, applyMiddleware(ReduxThunk));
| return (
> <HomeShell/>
| );
| };
我的宝贝
{
"presets": ["@babel/preset-env", "@babel/preset-react"]
}
mypackage.json
{
"name": "site name here",
"version": "1.0.0",
"description": "site desc",
"main": "index.js",
"type": "module",
"repository": {
"type": "git",
"url": "git url"
},
"author": "",
"license": "ISC",
"bugs": {
"url": "issues url"
},
"homepage": "readme url",
"dependencies": {
"@babel/polyfill": "^7.10.1",
"@types/express": "^4.17.6",
"axios": "^0.19.2",
"body-parser": "^1.19.0",
"express": "^4.17.1",
"nodemailer": "^6.4.5",
"path": "^0.12.7",
"react": "^16.13.0",
"react-dom": "^16.13.0",
"react-redux": "^7.2.0",
"react-router": "^5.1.2",
"react-router-dom": "^5.1.2",
"redux": "^4.0.5"
},
"devDependencies": {
"@babel/cli": "^7.8.4",
"@babel/core": "^7.9.0",
"@babel/preset-env": "^7.9.0",
"@babel/preset-react": "^7.9.4",
"babel-loader": "^8.1.0",
"css-loader": "^3.5.3",
"file-loader": "^5.1.0",
"html-loader": "^1.1.0",
"html-webpack-plugin": "^4.3.0",
"image-webpack-loader": "^3.6.0",
"style-loader": "^1.2.1",
"webpack": "^4.43.0",
"webpack-cli": "^3.3.11"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "rm -rf dist && mkdir dist && webpack && babel server -s -d dist",
"clean": "rm -rf dist",
"production": "npm run build && node bin/production",
"start": "npm run production"
}
}
我远不是react/webpack/babel方面的专家,但在我运行的另一个基本应用程序上,这个精确的设置似乎很好。不确定这两个应用程序之间有什么不同。我明白了
{
"presets": ["@babel/preset-env", "@babel/preset-react"]
}
在.babelrc文件和加载程序选项中。可能存在冲突。您提到您正在使用webpack.config.cjs文件,但目前webpack默认不支持该文件:
您需要显式传递-config webpack.config.cjs选项才能加载此文件。刚刚删除了我的webpack.config.cjs的加载程序选项中的预设选项,但仍然出现相同的错误。与我拥有的其他配置相比,我看到唯一有帮助的是在.babelrc文件中使用此选项{presets:[@babel/env,@babel/react]}而不是{presets:[@babel/preset env,@babel/preset react]}你确定你的webpack.config.cjs正在加载吗?如果你在其中放了一个console.log,它会打印出来吗?@loganfsmyth你是对的。它没有加载。我没有意识到新的.cjs结尾需要在终端/构建脚本中的-config选项中传递它。一切都很好。如果你作为答案发布,我会接受它
{
"name": "site name here",
"version": "1.0.0",
"description": "site desc",
"main": "index.js",
"type": "module",
"repository": {
"type": "git",
"url": "git url"
},
"author": "",
"license": "ISC",
"bugs": {
"url": "issues url"
},
"homepage": "readme url",
"dependencies": {
"@babel/polyfill": "^7.10.1",
"@types/express": "^4.17.6",
"axios": "^0.19.2",
"body-parser": "^1.19.0",
"express": "^4.17.1",
"nodemailer": "^6.4.5",
"path": "^0.12.7",
"react": "^16.13.0",
"react-dom": "^16.13.0",
"react-redux": "^7.2.0",
"react-router": "^5.1.2",
"react-router-dom": "^5.1.2",
"redux": "^4.0.5"
},
"devDependencies": {
"@babel/cli": "^7.8.4",
"@babel/core": "^7.9.0",
"@babel/preset-env": "^7.9.0",
"@babel/preset-react": "^7.9.4",
"babel-loader": "^8.1.0",
"css-loader": "^3.5.3",
"file-loader": "^5.1.0",
"html-loader": "^1.1.0",
"html-webpack-plugin": "^4.3.0",
"image-webpack-loader": "^3.6.0",
"style-loader": "^1.2.1",
"webpack": "^4.43.0",
"webpack-cli": "^3.3.11"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "rm -rf dist && mkdir dist && webpack && babel server -s -d dist",
"clean": "rm -rf dist",
"production": "npm run build && node bin/production",
"start": "npm run production"
}
}
{
"presets": ["@babel/preset-env", "@babel/preset-react"]
}