VUE(7)--vue项目打包以及出现的问题

1. 项目打包命令：npm run build

打包成功之后如图，此时项目中生成dist文件夹，里面有一个index.html文件，但是我们直接运行，页面是一片空白。

这句话是什么意思，就是说不能直接运行index.html，要在本地运行才可访问

2. 进入dist目录，输入anywhere -p 8080

至此，本地已经运行完毕，但是访问路径还是一片空白，打开控制台发现静态资源并没有加载进去

静态资源未加载解决办法：

1. 手动去index.html中将“/static”改为“./static” 

2. 项目中修改index.js，将assetsPublicPath修改为“./”，并且重新打包。（注意，修改之后要改回“/”，否则下次run dev运行要出错）

其实到这里打包的index.html就能显示了，但是还有一种原因导致页面空白是初始化router的时候mode的值改为history（默认设置是hash），修改为hash重新打包也可解决。

还有一种情况是上述解决方案都使用了，页面还是空白！

这个原因就是出在路由的配置上，打包文件本地运行的地址是“192.168.1.1:8080/”，而routes中配置的首页path是“/login”，如图

在开发环境下，localhost:8080/login才可以访问，但是打包之后没有/login，所以这个时候访问也会是一片空白！

解决方法-----重定向（redirect）

export const routes = [
{ 
	path:'/',
	redirect:"/login"//重定向，访问/的时候定向到/login路径，这样默认首页就是login
},
{
	name:'login',
	path:'/login',
	component:login
}]