Vue项目部署的实现(阿里云+Nginx代理+PM2)-创新互联
最近部署一个Vue项目到阿里云ECS上,因为项目涉及一些跨域请求,所以采用了Nginx
代理请求本地的node
服务(利用pm2
做进程管理)。node
服务借助axios
设置headers
的referer
、host
转发请求,解决跨域请求问题。
先交代下在阿里云ECS里安装的部署环境:phpstudy
(php调试运行大礼包,里面包含nginx、mysql等,还能监控端口占用情况)、pm2
(node服务进程管理工具)、node
、git
等等。
部署过程
- 拉去GitHub项目代码至root目录下(找到安装phpstudy的WWW目录),构建项目
- 修改nginx-conf的代理配置、root项配置(指向项目项目的dist目录下)
- 启动pm2(项目中,事先已写好服务端逻辑prod.server.js)
- 启动phpstudy
- 访问项目
构建项目
构建项目前,要修改项目confing
目录下的index.js
,主要是build
部分的端口、目录,具体如下:
build: { port: 9001, // 因为我是用PHPStudy做web服务器的,此时php.cgi会占9000端口,所以改用9001 // Template for index.html index: path.resolve(__dirname, '../dist/index.html'), // Paths assetsRoot: path.resolve(__dirname, '../dist'), assetsSubDirectory: 'static', assetsPublicPath: '', ....... }
文章题目:Vue项目部署的实现(阿里云+Nginx代理+PM2)-创新互联
网站网址:http://scgulin.cn/article/pgiis.html