Question

我的反应项目中存在问题。我正在使用webpack dev服务器来提供我的文件。 webpack构建成功，但我在浏览器上收到错误，如

“app.js：7 Uncaught SyntaxError：意外的令牌导入”

在该行：

import React from 'react';

以下是我的webpack.config.js

module.exports = {
context: __dirname + "/app",    
entry: "./app.js",     output: {
    filename: "app.build.js",
    path: __dirname + "/dist",
},

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

        { 
            test: /\.js$/, 
            exclude: /node_modules/, 
            loaders: ["react-hot-loader", "babel-loader"],
        }

    ]
}    
};

在.babelrc我有

{
   "presets": ["react", "es2015"]
}

我尝试添加各种babel配置，比如使用stage-0，stage-2等，但是没有一个工作。有没有办法解决这个问题。

Answer 1

我找到了自己问题的答案：

反应热加载程序的工作方式是webpack config.js中提到的输出文件app.build.js直接由热加载程序服务器提供，但不是在config中提到的特定路径（dist /）下创建的。

所以localhost / app.build.js可用而不是localhost / dist / app.build.js。

当我在我的index.html中引用“script src =”app.build.js“时，它开始工作。

文件app.build.js仅在“webpack”或“webpack --watch”命令的path（“/ dist”）中创建。不适用于“webpack-dev-server”命令。

React的'import'问题，webpack热重载

1 个答案: