能否在VS2022中直接将新建的独立Angular项目(esproj)发布到Azure？

完全可以通过VS2022自带的发布功能完成全流程部署，不需要额外借助其他工具，操作流程如下：

前置准备 #

• 你的VS2022登录账号绑定了可用的Azure订阅，且具备对应资源的部署权限
• 本地Angular项目运行正常，执行 npm run build 可正常生成构建产物

发布操作步骤 #

• 在VS2022的解决方案资源管理器中右键点击Angular项目，选择「发布」选项
• 在弹出的发布目标选择窗口中，选中「Azure」后点击下一步
• 根据你的业务需求选择适配的Azure服务，纯前端Angular项目推荐选择「Azure静态Web应用」，也可以选择Azure应用服务等其他服务，确认后点击下一步
• 选择对应Azure订阅，以及要部署的目标资源实例，没有现成实例的话可以直接在当前窗口新建符合要求的资源
• 确认部署配置参数：VS2022会自动识别Angular项目的默认构建命令、输出目录（默认输出路径为 dist/[项目名称]），无特殊需求不需要修改，确认后点击「发布」
• 等待VS2022自动完成依赖检查、项目构建、资源上传、部署生效全流程，部署完成后会直接返回可访问的线上地址

常见问题排查 #

• 发布过程中构建失败：优先检查本地是否执行过 npm install 安装全量依赖，本地单独执行构建命令是否正常
• 部署完成后访问404：检查配置的输出目录是否和实际构建产物目录一致，使用Azure静态Web应用的话需要额外配置SPA路由回退规则

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