Question

我有一个使用webpack构建的小型React应用，它已编译为/dist/bundle.js。然后，我有一个快递服务器来为引用我的bundle.js的HTML文件提供服务。这样，当我连接到Express服务器时，它将包含我的React应用程序。 express提供的HTML文件如下：

<!DOCTYPE html>
<html>
  <head>
    <title>The Minimal React Webpack Babel Setup</title>
  </head>
  <body>
    <div id="app"></div>
    <script src="./dist/bundle.js"></script>
  </body>
</html>

但是当在本地运行并在浏览器中打开它时，没有任何显示。在检查源代码时，我可以看到HTML文件在那里，但是页面上没有任何显示。

我的server.js如下：

var express = require('express');
var app = express();
var path = require('path');

app.get('/', function(req, res) {
  res.sendFile(path.join(__dirname + '/index.html'));
});

app.listen(8080);

为什么我看不到我的React应用程序？感谢您的帮助！

检查页面时，我看到以下内容（无法真正复制并粘贴，因此添加了屏幕截图）：

Answer 1

您需要包括对服务器上静态资产的访问。

app.use(express.static('dist'));// put the correct folder here

https://expressjs.com/en/starter/static-files.html

加载包含应用程序的HTML页面时，React应用程序根本不呈现

1 个答案: