如何通过ng build将生成的chunk文件放入子文件夹？

当然有对应的构建选项可以实现这个需求，以下是两种常用的配置方式：

方式一：修改项目配置文件（永久生效） #

在项目根目录的angular.json中，找到对应项目的architect -> build -> options节点，添加或修改以下两个配置项：

• outputPath：指定构建产物的输出路径，设置为dist/my-subfolder后，所有编译生成的文件都会自动放到dist目录下的my-subfolder子文件夹中
• baseHref：设置为/my-subfolder/，这样index.html里的资源引用路径会自动加上该前缀

示例配置片段：

"architect": {
  "build": {
    "options": {
      "outputPath": "dist/my-subfolder",
      "baseHref": "/my-subfolder/",
      // 保留其他原有配置项
    }
  }
}

配置完成后执行ng build，生成的index.html中的资源引用就会变成你需要的形式，且所有chunk文件都位于dist/my-subfolder目录内。

方式二：构建命令传参（临时生效） #

如果不想修改配置文件，也可以在执行构建命令时直接传递参数：

ng build --output-path=dist/my-subfolder --base-href=/my-subfolder/

执行这条命令后，效果和修改配置文件完全一致，仅对当前本次构建生效。

注意：如果只需要修改引用路径前缀但不想移动文件位置，可以单独使用--deploy-url=my-subfolder/参数，但这种情况需要手动将构建产物移动到对应子文件夹，一般不推荐这种方式。

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