vue 搭建一个本地服务器运行打包后dist文件

需求场景：完成一个vue项目后，利用webpack进行打包生成的dist文件夹，预览打包后的页面效果。
说明：通常由于 publicPath 问题导致显示空白页面，除了通过在config中修改 publicPath 为 './' ，搭建本地服务器来运行dist文件也是一种较佳的选择，每次build后只需要一个命令则预览到效果。

1. 安装http-server

npm install install -g http-server

npm有时候很慢，可换cnpm（安装）较快，或者npm配置为淘宝镜像

# 配置npm的registry地址
npm config set registry https://registry.npm.taobao.org

2. 开启http-serve本地服务

#在项目根目录下运行如下命令，且前提你已经进行npm run build打包dist文件
http-server ./dist

运行后会出现访问ip，如下

运行http-serve命令后.png

3. 浏览器预览

浏览器输入以上的ip即可预览

效果预览.png