如何在nginx下部署vue项目

版权声明:转载请注明出处! https://blog.csdn.net/zjq_1314520/article/details/80031815

首先我们使用 npm run build 来生成项目的静态页面,会在项目的根路径的dist目录下

我们将dist下的 index.htmlstatic静态文件发布到服务器的某一目录下

比如说我们发布的是 在 usr/local/vue/page下,那么我们对于nginx的配置如下

/usr/local/nginx/conf下打开nginx.conf
修改service的内容如下

    server {
        listen       80;
        server_name localhost;

        location / {
            root usr/local/vue/page;
            try_files $uri $uri/ @router;
            index index.html;
        }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
            root html;
        }
        location @router {
            rewrite ^.*$ /index.html last;
        }
    }

然后用nginx -s reload重新启动nginx即可

如果出现403 Forbidden的报错,应该是权限导致的,我们在nginx.conf文件头部加上user root;
如下

#user  nobody;
user root;
worker_processes  1;
阅读更多
想对作者说点什么?

博主推荐

换一批

没有更多推荐了,返回首页