时间戳

首页 > 解决方案 > express js空白根页面

express - express js空白根页面

问题描述

我有一个简单的 vue js 应用程序和下一个 express 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文件夹中。但是我的 express js 文件位于/

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

我的目的是在访问localhost:1111时从/dist接收 index.html 。

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

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

/ -> express js 配置在这里，基本的 index.html 在这里

/dist -> 构建结果位于此处（index.html + 静态文件）

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

/build -> webpack 配置在这里

标签： expressvue.js

解决方案

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

显然我必须改变

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

到

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

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

推荐阅读