我正在尝试使用Webpack构建一个简单的React应用程序,但是在从Webpack dev服务器运行时,我遇到以下错误:
> ERROR in ./client/components/home.js Module parse failed: Unexpected
> token (8:3) You may need an appropriate loader to handle this file
> type. | render(){ | return( | <h1>Hello World!</h1> | ) | }
> @ ./client/app.js 13:12-43 @ multi
> (webpack)-dev-server/client?http://localhost:8080 ./client/app.js
以下是我的Webpack.config.js文件内容:
var path = require('path');
var debug = process.env.NODE_ENV !== 'production';
var webpack = require('webpack');
module.exports = {
context: __dirname,
devtool: debug ? 'inline-sourcemap' : null,
entry: './client/app.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'app.js'
},
module: {
loaders: [{
test: /\.js?$/,
exclude: /(node_modules|bower_components)/,
include: [path.resolve(__dirname, 'client/app.js')],
loader: 'babel-loader',
query: {
presets: ['react', 'es2015', 'stage-3'],
plugins: ['transform-react-jsx']
}
}, {
test: /\.scss$/,
include: [path.resolve(__dirname, 'sass/style.scss')],
loaders: ['style-loader' ,'css-loader' ,'sass-loader']
}]
},
plugins: debug ? [] : [
new webpack.optimize.DedupePlugin(),
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.optimize.UglifyJsPlugin({
mangle: false,
sourcemap: false
}),
],
};
app.js文件内容从“React”导入React从“React dom”导入ReactDOM从“React dom”导入{Switch,BrowserRouter,Route}从“React router dom”导入Home从“./components/Home.js”
ReactDOM.render((
<BrowserRouter>
<Switch>
<Route exact path="/" component={Home}/>
</Switch>
</BrowserRouter>
),
document.getElementById('app')
)
我认为这可能与您的加载器的包含
属性有关:
// Here you are telling babel to ONLY transpile client/app.js. One file.
include: [path.resolve(__dirname, 'client/app.js')]
应该是:
// Instead, it needs to transpile ALL .js files under /client
include: [path.resolve(__dirname, 'client')],
我刚刚开始使用一个升级的模板将我的aspdotnet core Aurelia项目升级到3.0,该模板是我用来创建项目的模板。 我把我的文件(在以前的项目工作)到这个新版本,我已经结束了一堆错误,从webpack的第一个是在标题中概述。 网页包也已升级。这是我收到的第一个错误。。 发现了与此相同的问题,结果发现我没有替身,所以是另外一个问题。。 我还检查了这个标题非常相似的问题,但我相信webpa
我得到下面的错误,我不明白为什么我认为应该有一些与巴贝尔。我使用web开发服务器和babel。它在反应。 我的Webconfig文件如下所示: 我的package.json文件如下所示: 我错过了什么?这与path.resolve有关吗?
组件如下所示。是我正在使用链接的本地依赖项 uilib/index.css如下所示
我是tryiyng运行与webpack反应。我得到以下错误: ./src/index.js 14:4模块解析失败时出错:意外标记(14:4)您可能需要适当的加载程序来处理此文件类型,目前没有配置加载程序来处理此文件。 webpack.config.js package.json
我在做“NPM运行构建”我的react应用程序时遇到了一个问题。其说法如下: 下面提到的错误: 4)./src/helloworld.jsx 5)package.json
我正在学习反应,并试图用webpack创建一个样板。我遵循了一个教程,在他的视频作品的一切,但在我的电脑上,我得到的错误消息,一个适当的加载器需要处理一个特定的文件类型。 这就是错误产生的文件 以下是错误消息: ./src/index.js 5:16模块解析中出错失败:意外标记(5:16)您可能需要适当的加载程序来处理此文件类型。|从“./components/App”导入应用程序| ReactD