Question

我试图将一个angular-cli项目部署到nginx，我遇到了css / js无法加载的问题，我应该在nginx文件夹中复制dist文件？

Answer 1

可能存在一种可能性，这就是为什么您在加载资产时遇到问题/错误的原因：

index.html head标记中的基础href错误
ng build命令错误--base-href值
错误的nginx配置（即服务器根或服务器位置/）

以下是解决方案：

假设您要在主持人处部署角度应用：http://example.com和PORT：8080 注 - 在您的情况下，HOST和PORT可能会有所不同。

确保index.html头标记中有<base href="/">。

首先，转到您机器上的角度回购（即/ home / user / helloWorld）路径。
然后使用以下命令为生产服务器构建/ dist：

ng build --prod --base-href http://example.com:8080
现在将copy / dist（即/ home / user / helloWorld / dist）文件夹从您机器的angular repo复制到您要托管生产服务器的远程计算机。

现在登录到您的远程服务器并添加以下nginx服务器配置。

server {

    listen 8080;

    server_name http://example.com;

    root /path/to/your/dist/location;

    # eg. root /home/admin/helloWorld/dist

    index index.html index.htm;

    location / {

        try_files $uri $uri/ /index.html;

        # This will allow you to refresh page in your angular app. Which will not give error 404.

    }

}

现在重启nginx。
就是这样!!现在，您可以在http://example.com:8080

希望它会有所帮助。

将Angular-cli项目部署到nginx

1 个答案: