Linux部署vue工程

下面是linux系统（ubuntu）下基于Nginx部署Vue工程的部署步骤。

1、安装Nginx

#更新源
apt-get update
#安装nginx
apt-get install nginx
#查看安装成功后的版本
nginx -v
#启动nginx
server nginx restart

2、打包vue工程

npm run build

将打包成功后的dist文件上传到服务器上，我的位置是 /home/vue/dist。

3、配置Nginx

安装成功后的nginx的默认路径是：/etc/nginx

修改目录下的 nginx.conf 文件

在http模块下引入vue项目的配置文件：

include /etc/nginx/myconfig/*.conf;

创建 myconfig 文件夹

mkdir myconfig 

在 myconfig 文件夹下创建 vue.conf 文件

server {
        listen       8080;
        server_name  vue; # 随便起
        location / {
            root   /home/vue/dist;# vue工程的上传地址
            index  index.html;
        }
        error_page   500 502 503 504  /50x.html;
    }

重启Nginx

nginx -s reload

4、可能遇到的403问题

原因是该项目所在的文件没有权限访问，我的路径是/home/vue/dist。

chmod -R 777 home
chmod -R 777 vue
chmod -R 777 dist