Nginx部署前端vue后端express项目步骤细节
最新回答
枫熙槿晨
2020-12-19 10:15:57
Nginx部署前端Vue后端Express项目的详细步骤如下：
1. 配置Nginx 步骤：在Nginx安装目录的conf文件夹中找到并打开nginx.conf文件。 内容：添加一个server块，设置反向代理监听特定端口。
2. 开放端口 步骤：在nginx.conf文件中配置server_name，允许Nginx监听指定IP地址和端口。
3. 定位前端资源 步骤：在nginx.conf文件中设置root路径，指向打包后的Vue项目dist文件夹。 注意：确保路径使用正斜杠/，避免Windows中的反斜杠问题。
4. 处理跨域 步骤：在nginx.conf文件中配置相应的location块，转发跨域请求，确保前后端接口路径一致。 目的：由于前端使用vue.config.js的devServer处理跨域，Nginx也需相应配置。
5. 后端服务 步骤：后端Express应用监听特定端口，并使用pm2进行管理。 启动命令：pm2 start app.js。
6. 使用pm2管理后端服务 安装：全局安装pm2进行项目管理。 功能：提供开机自启动、进程监控等高级功能。 启动命令：安装成功后，通过pm2 start app.js启动Express项目。
总结：以上步骤涵盖了Nginx部署Vue+Express项目的主要流程，包括Nginx配置、端口开放、前端资源定位、跨域处理、后端服务启动以及使用pm2进行后端服务管理。
热门标签
