表示 JS 空白根页

Question

我有一个简单的 vue js 应用程序与下一个快速 js 配置文件

var express = require('express');
var http = require('http');
var app = express();
var server = http.createServer(app);
app.use(express.static('.'));
server.listen(1111);

生成结果位于 /dist 文件夹中。但是我的快速js文件位于/

运行它后，我在 localhost：1111 上看到空白页，实际上它从 /但是.html 上检索索引，我在 localhost：1111/dist 上看到我的应用程序，它从 /dist 检索索引.html

我的目的是在访问 localhost：1111 时从 /dist 接收索引.html。

我试图将快速配置更改为app.use(express.static('./dist'((和类似的。但它只会破坏任何东西(我无法在 localhost：1111/dist 和 localhost：1111/上访问我的应用程序(

一般来说，我有下一个项目结构

/ -> Express js config 在这里，基本索引.html在这里

/dist -> 构建结果位于此处(索引.html + 静态文件(

/dist/static -> 静态文件在这里

/build -> webpack config 在这里

Answer 1

app.use(express.static('dist'));不起作用的问题是在索引中.html我链接到其他文件，例如/dist/static/..如果我的根文件夹是 dist 则不正确的文件。因此，尽管版主设置了 webpack 与此无关，但解决方案是更改生产的 webpack 配置，以使构建脚本生成指向/dist/index.html 中的文件的链接，例如/static/.. 而不是/dist/static/.。

显然我必须改变

app.use(express.static('.'));

自

app.use(express.static('dist'));

作为结论 - 检查生成的索引.html并分析那里的路径是否正确是有意义的。

Answer 2

有时可能会出现此问题，因为应用程序不会从根文件夹进行服务器。 例如，/home/user/path-to-the-project">应用程序需要像这样服务。

所以在这里你需要像下面这样改变，

app.use(express.static(__dirname + '/dist'));

有关更多信息，请查看快速文档。看这里