使用Webpack（BabelJS）进行编译后，React应用无法呈现

Question

这篇文章是我以前关于同一问题的文章的扩展。 我的反应代码仍未呈现，但是我从故障排除工作中收集到了新信息：

1）上一个帖子的响应者让我的代码在他的环境中工作。 为了匹配他的环境，我下载了babel-core，babel-loader和babel-preset-2015。 我还更改了webpack.config.js的版本：

module.exports = {
    context: __dirname, 
    entry: "./src/App.js",

    output: {
        filename: "app.js",
        path: __dirname + "/assets"
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: "babel-loader",
                query: {
                    presets: ["react", "es2015"]
                }
            }
        ]
    }
}

2）该问题与服务器无关，因为heroku成功交付了所有文件。

3）这不是浏览器相关的问题，因为该应用程序无法在Chrome，Firefox和Safari中呈现。

我所能想到的是问题与webpack / babel有关，但是你们还有其他想法吗？

Answer 1

从转到URL： https : //dry-river-67944.herokuapp.com/

看来您的js文件没有发送下来。 而是将/:input的get请求处理程序用于该请求。

app.get("/:input", (req, res) => {
    //Assign headerVal to Access-Control-Allow-Origin response header
    res.set('Access-Control-Allow-Origin', "*")

    //Send response data
    var convertedData = timestampMicroServ(req.params.input)
    res.end(convertedData)
})

应该放在您的staticfile中间件之后或命名空间（ /api/:input ？）：

app.get("/", express.static(path.join(__dirname, '/TMS-Front-End/assets')))