设置base-href执行ng build后，Nginx部署访问localhost/emp/报错求助

这个Uncaught SyntaxError: Unexpected token <错误其实很好定位——浏览器请求的runtime.js、polyfills.js这些JS文件，实际返回的是HTML内容（大概率是Nginx找不到资源返回的404页面或者默认的index.html），浏览器把HTML当成JS解析，自然就报语法错误了。下面一步步排查解决：

1. 先确认静态资源的路径和链接是否正确 #

• 打开你执行ng build --base-href /emp/后生成的dist/index.html，检查里面的资源引用，应该是类似<script src="/emp/runtime.js"></script>这样的，确保--base-href参数已经生效。
• 验证符号链接是否正确：执行ls -l /var/www/html/emp，确认这个链接确实指向了Angular打包后的dist目录；如果是复制文件的方式，要确保dist里的所有内容都放到了/var/www/html/emp目录下，而不是把dist文件夹本身作为/var/www/html/emp。

2. 修正Nginx配置 #

你的Nginx默认服务器配置需要正确处理/emp/路径的请求，尤其是Angular单页应用的路由和静态资源查找。修改你的Nginx配置文件（通常在/etc/nginx/sites-available/default或/etc/nginx/nginx.conf），在server块中添加或修改如下配置：

location /emp/ {
    root /var/www/html;
    # 先尝试匹配请求的静态文件，找不到就返回index.html让Angular处理路由
    try_files $uri $uri/ /emp/index.html;
}

配置说明： #

• root /var/www/html：指定Nginx查找静态资源的根目录，这样请求/emp/runtime.js时，Nginx会去/var/www/html/emp/runtime.js查找，也就是你链接的dist目录里的文件。
• try_files指令：确保静态资源能被正确找到；当请求的是Angular路由路径（比如/emp/dashboard）时，返回index.html让Angular的路由系统处理，避免出现404。

3. 验证配置并重启Nginx #

• 先检查配置是否有语法错误：

  sudo nginx -t
  

• 如果提示test is successful，就重启Nginx服务：

  sudo systemctl restart nginx
  # 或者用service命令（取决于你的系统）
  sudo service nginx restart
  

4. 清除浏览器缓存 #

最后，强制刷新浏览器页面（Ctrl+F5），或者直接清除浏览器缓存后再访问localhost/emp/——有时候浏览器会缓存旧的资源路径，导致请求错误。

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