如何在Plesk Web Host Edition部署Angular 16+应用？

1. 部署文件选择 #

Angular 16+ 执行ng build后，dist/[你的项目名]/browser文件夹就是原版本dist目录里的静态文件集合，只需要把browser文件夹内的所有文件上传到Plesk的网站根目录（通常是httpdocs或你指定的网站根路径），不需要上传整个dist文件夹。

2. .htaccess 配置调整 #

如果你的Angular应用用了HTML5路由（非哈希路由），需要在网站根目录创建.htaccess文件，添加以下配置确保路由正常：

RewriteEngine On
# 存在的文件/目录直接访问
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
# 其他请求重定向到index.html
RewriteRule ^ /index.html

3. Plesk操作步骤 #

• 登录Plesk后台，进入对应网站的「文件」管理模块
• 删除根目录下默认的示例文件（如index.html、readme等）
• 上传browser文件夹内的所有文件到根目录
• 上传配置好的.htaccess文件
• 访问域名验证应用是否正常运行

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