美文网首页
如何将vue工程部署到nginx下

如何将vue工程部署到nginx下

作者: 听风不予 | 来源:发表于2019-07-19 15:39 被阅读0次

    如何将vue工程部署到nginx下

    下载nginx

    官网:http://nginx.org/en/download.html

    将打包编译好的前端工程放到nginx下的目录下

    我这里是新建了一个名为'www'的文件夹,可以自己命名


    image.png
    image.png

    修改nginx的配置文件

    image.png

    关键配置信息

    listen       8090;
            server_name  localhost;
            location / {
                root  www/dist; //只想index的页面
                try_files $uri $uri/ @router;
                index  index.html index.htm;
            }
            location @router { //配合vue中的router使用
                rewrite ^.*$ /index.html last;
            }
            
            location /east {
                root  www/dist;
                try_files $uri $uri/ @router;
                index  index.html index.htm;
            }
            
            location @router {
                rewrite ^.*$ /index.html last;
            }
            //静态资源的指向路径
            location ~ .*\.(jpg|jpeg|gif|png|ico|css|js|pdf|txt)$ {
                root www/dist;
                proxy_temp_path www/dist;
            }
    

    相关文章

      网友评论

          本文标题:如何将vue工程部署到nginx下

          本文链接:https://www.haomeiwen.com/subject/idhslctx.html