阿里云Linux部署vue项目

1、安装Nginx

安装Nginx的方法有很多种,我是直接在宝塔面板上面软件商店安装的Nginx。
ps:宝塔面板安装看这里:https://www.bt.cn/bbs/thread-19376-1-1.html
在这里插入图片描述

2、把vue项目打包

将你所需要发布的vue项目打包。
打包命令:npm run build
打包成功后会有一个dist的文件夹,这个文件夹就是你所需要发布的文件夹。
在这里插入图片描述

3、配置Nginx

我是直接在宝塔面板上修改了Nginx的配置文件,添加了以下代码(在http代码块中添加server代码块):

server 
    {
        # 设置的端口号需要放行才行(阿里云安全组中加入该端口号放行)
        listen 8087;
        server_name localhost;

        # 注意设定 root路径是部署所在的路径
        # 我这里是将生成的dist文件夹上传放在/usr/local/nginxboot下
        location / {
        root /usr/local/nginxboot/dist;
        index /index.html;
        }

        #跨域 ip自行替换,设置的端口号也需要放行才行
        location /adminApi {
        proxy_pass http://ip:8087;
        }
        
        }
    }

或者你可以在安装Nginx的所在目录下找到conf文件夹中的nginx.conf文件,去修改这个文件也是一样的。
在这里插入图片描述

配置完成后重新加载配置或者重启Nginx,修改的配置即可生效。
之后即可输入http://ip:8087访问你的vue项目。
在这里插入图片描述

Logo

技术共进,成长同行——讯飞AI开发者社区

更多推荐