Angular4---部署---Angular 与 Nginx的邂逅

Nginx + Angular结合操作

1.下载Nginx , 根据自己的版本下载Nginx,关于Nginx配置,请看https://www.cnblogs.com/MBirds/p/6605366.html

2.将angular项目打包,并将生成的dist文件夹发布到服务器上或本地

ng build --aot // 编译方式无要求

 3.接下来配置nginx的conf文件了,打开安装目录下的conf/nginx.conf

在http节点下添加server节点,原有的server有示例可以直接copy一份

如我的配置

server {
        listen       8081;
        server_name  localhost;
        location / {
            root   C:/website/angular/ng-prime/dist; // 这是angular生成的dist文件夹存放的位置
            index  index.html;
	try_files $uri $uri/ /index.html; // 注意此句,一定要加上。否则配置的子路由等无法使用
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }

4.运行nginx,然后就可以访问了

 

posted @ 2017-12-22 13:46  古道瘦西风  阅读(6923)  评论(0编辑  收藏  举报