我坚持同样的错误,我需要新的眼睛寻求帮助......我对“适当的装载机”感到困惑。我以为这是来自webpack文件中的一个不正确的正则表达式。我查看了babel文档和issue以获得指导。
这是错误......
> ./src/index.js中的错误 模块解析失败:意外的令牌(6:16)您可能需要适当的加载程序来处理此文件类型。
@ multi(webpack)-dev-server / client?http://localhost:8080 ./src
这是我的 src / index.js
import React from 'react'
import ReactDOM from 'react-dom'
import App from './Components/App'
ReactDOM.render(<App />, document.getElementById('root'))
.babelrc
{
"presets": ["env", "react"],
"env": {
"development": {
"plugins": [["react-transform",{
"transforms": [{
"transform": "react-transform-hmr",
"imports": ["react"],
"locals": ["module"]
}]
}]]
}
}
}
webpack.dev.config.js
const path = require('path')
const webpack = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'build'),
publicPath: '/',
},
module: {
rules: [
{ test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/,
include: [path.resolve(__dirname, "src")]
}
],
},
devServer: {
historyApiFallback: true,
inline: true,
hot: true,
},
plugins: [
new HtmlWebpackPlugin({template: 'src/index.html'}),
new webpack.HotModuleReplacementPlugin()
],
}
和我的 package.json
{
"name": "webpack-starter-kit",
"version": "1.0.0",
"description": "starter files for basic development and production using React, Babel, Webpack",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "webpack-dev-server --progress --mode=development",
"build": "webpack --mode=production"
},
"author": "Kevin Turney",
"license": "ISC",
"dependencies": {
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-router-dom": "^4.2.2"
},
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-core": "^6.26.0",
"babel-loader": "^7.1.4",
"babel-plugin-react-transform": "^3.0.0",
"babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.24.1",
"css-loader": "^0.28.11",
"extract-text-webpack-plugin": "^3.0.2",
"file-loader": "^1.1.11",
"html-webpack-plugin": "^3.0.7",
"postcss-loader": "^2.1.2",
"react-transform-hmr": "^1.0.4",
"style-loader": "^0.20.3",
"uglifyjs-webpack-plugin": "^1.2.4",
"webpack": "^4.6.0",
"webpack-cli": "^2.0.15",
"webpack-dev-server": "^3.1.1"
}
}