vue项目打包后部署在nginx服务器

vue-cli打包

1. vue.config.js文件配置，发布到nginx的情况下，生产环境（正式环境）需要改为“/”

   module.exports = {
     publicPath: process.env.NODE_ENV === "production" ? "/" : "/", //部署应用包时的基本 URL
     outputDir: "dist", //打包目录
     indexPath: "index.html"
   }
   

2. 打包
   npm run build
   首先打包项目，会在项目中生成一个dist文件夹。

服务器部署

1. 将此文件（dist）导入至nignx服务器html文件目录下。
2. 如图所示设置基本配置在nginx服务器下conf目录下nginx.conf。
3. vue.config.js扩展

在windows上快速安装nginx服务器

1. 下载nginx服务器http://nginx.org/en/download.html
   我这里选择的是1.14.2，下载成功后解压到你将要安装服务器的位置（注意解压后文件路径中不要有中文）。
2. 打开文件夹
   双击exe文件或命令行输入：start nginx.exe

3.打开浏览器，输入127.0.0.1就会看到启动成功的页面
nginx.exe -s reload 重启nginx