Angular 6项目部署至NodeJS服务器非根路径/v3/的配置问题

我之前也碰到过一模一样的情况，开发环境正常但部署后页面空白，核心问题就是构建时资源路径没加上前缀，再加上Express的静态资源配置没到位。给你分两步解决：

1. 构建Angular项目时自动添加/v3/前缀 #

你只改了index.html的base href是不够的，Angular构建的时候需要明确指定资源的部署路径。执行构建命令时加上--base-href和--deploy-url参数：

ng build --base-href /v3/ --deploy-url /v3/

• --base-href：设置Angular路由的基础路径，确保路由跳转正常
• --deploy-url：告诉Angular把所有CSS/JS等静态资源的路径前缀设为/v3/，这样构建出来的index.html里的script、link标签就会自动变成src="/v3/xxx.bundle.js"这种格式，不用手动修改。

2. 正确配置Express服务器 #

你的现有配置只处理了路由 fallback，但静态资源的请求（比如加载/v3/inline.bundle.js）还没被正确处理。需要先配置静态文件服务，再处理路由：

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

// 第一步：配置静态资源，让Express能处理/v3开头的静态文件请求
app.use('/v3', express.static(path.resolve('../dv-ui/dist')));

// 第二步：处理Angular的路由，所有/v3下的非静态资源请求都返回index.html
app.get('/v3/*', (req, res) => {
  res.sendFile(path.resolve('../dv-ui/dist/index.html'));
});

app.listen(3000, () => {
  console.log('Server running on port 3000');
});

这样配置后，当访问http://localhost:3000/v3/时：

• Express会先找dist文件夹里的静态资源（比如index.html、各种bundle.js）
• 页面加载后，Angular的路由也会基于/v3/正常工作，刷新页面或者跳转路由都不会出现404。

内容的提问来源于stack exchange，提问作者user3006967