vue项目部署到服务器页面空白的问题
接触vue也有一段时间,正好公司有个手机端项目涉及到较多数据处理方面的问题,考虑了一下就打算用vue进行开发,前期也是各种顺利,只在兄弟组件间通信时使用bus.vue中转的时候出现第一次点击没有派发事件,考虑可能是点击元素派发使事件,又需点击确认按钮进行路由跳转出现的问题,不好解决该问题,使用vuex进行组件间数据通信,解决问题。
一直到项目上线前都没有大问题出现,就等部署到部署到服务器,因为也是第一次使用vue上线的项目对后面的坑也是一无所知,直接使用webpack打包了dist目录就发给后端部署到服务器上去了;然后就出现如下问题;
- 路由跳转的时候使用
mode: 'history'
去掉#号,放到服务器crm目录下,根据www.asa.com/crm路径访问,出现获取不到资源问题,页面一片空白,搜索问题,路由配置文件中添加mode: 'history', base: '/crm/',
。 - 然后资源都获取到了也都加载了但是页面还是空白,没有进行渲染(这个问题好像和问题1相同,当时没有记录下来现在回忆起来有点模糊),通过后端配置解决了问题。
- 页面渲染成功各页面跳转页都正常了,但是又出现了在当前页面刷新都会出现404的问题,因为只有一个index.html文件,url中的路由跳转都是vue-router进行在实际文件中没有login.html等文件,服务器在找这些页面会找不到出现404错误,因此需要后端服务器配置进行404全部跳转到index.html解决问题。</