Angular PWA部署在站点子目录时静态资源无法加载的配置问题

核心问题是当前配置的base href="/"会让所有资源请求默认指向站点根目录，按以下步骤调整即可：

配置方式（二选一即可） #

• 方式1：永久修改项目配置文件
  打开项目根目录的angular.json，找到对应项目下architect > build > options节点，新增/修改两个配置项：

  "baseHref": "/pwa/",
  "deployUrl": "/pwa/"
  

  调整后正常执行ng build --prod生产构建即可。
• 方式2：构建时动态传参（无需改配置文件，灵活适配多环境部署）
  执行生产构建命令时直接传入参数：
  ng build --prod --base-href /pwa/ --deploy-url /pwa/

注意：/pwa/前后的斜杠不可省略，否则会出现路径拼接错误。PWA相关的manifest、Service Worker注册路径会自动适配baseHref配置，无需额外修改。

验证规则 #

构建完成后打开dist目录下的index.html，确认head标签内的base标签为<base href="/pwa/">，所有静态资源引用路径前缀都包含/pwa/即配置生效。部署完成后根目录落地页跳转链接直接指向/pwa即可正常访问PWA应用。

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