Visual Studio Community 2022无法构建Angular项目至dist/文件夹？

默认情况下，Visual Studio的Build命令（F6/Shift+F6）仅编译TypeScript代码，不会触发Angular的生产构建流程，因此不会生成dist文件夹。以下是几种解决方法：

方法一：手动执行npm构建命令 #

• 打开Visual Studio终端（视图 → 终端），切换到项目根目录（包含package.json的文件夹）
• 运行生产构建命令：ng build --configuration production
  执行完成后，项目根目录下会自动生成dist文件夹，里面是可直接部署的编译产物。

方法二：配置Visual Studio让Build命令自动触发Angular构建 #

若希望每次执行Build（F6）时自动生成dist文件夹，可修改项目配置：

1. 右键项目 → 属性
2. 左侧选择TypeScript Build，在Command Line Options中添加--build（适配Angular构建触发逻辑）
3. 或者在Post-build event command line中添加以下命令：

   cd "$(ProjectDir)"
   npm run build -- --configuration production
   

   这样每次Visual Studio完成项目编译后，会自动执行Angular的生产构建，生成dist文件夹。

方法三：确认Angular配置文件的输出路径 #

检查项目根目录下的angular.json，确保输出路径设置为dist：

• 找到projects → 你的项目名称 → architect → build → options
• 确认outputPath的值为"dist"，若不是则修改为该值，确保构建产物输出到dist文件夹。

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