关键词：
参考技术Aso在这个过程中无可避免的还是踩了一些坑，所以记录之，先大致说下用到的技术栈：vue全家桶（vue/vue-router/vuex）、sass、axios还有一套ui框架mint-ui，大致也就这些。下面来扒扒都遇到哪些坑。
1.vue-cli脚手架打包的项目部署到服务器上打开空白
首先可以确保路径是没问题的，vue-cli打包生产环境直接修改config目录下的index文件即可。将assetsPublicPath指向你所要放置的服务器目录，并用最后一个文件夹名作为你的项目名。如 http://baidu.com/app/events/my_activity 。 那路径没问题的话。问题出在哪里呢？经过排查，是vue-router中将mode设置为\'history\'的缘故。由于一开始以hash模式的url是带\'#\'号的，本来想着让url好看点，所以用了history模式。虽然在本地调试的时候没问题，但是不部署的话还是需要后台进行相关配置的。这里百度一大堆，不赘述了，随便贴个地址， 看这里
2.webview上自带的坑
讲真的这个只能找你们移动开发的同事。比如我这边遇到的是H5页面内嵌的时候上拉下拉会出现回弹的效果，这是他们加上的，这个难免会对h5造成一些手势冲突。比如我只是想滑动底部的时间选择器来选时间，但是页面不受控制会自动上弹。还有就是定位在中部或底部的输入框，理应在弹出软键盘时自动将键盘顶上去的，这个也应该由移动端开发那边来做相关设置。
3.单页应用不重载页面导致无法调用IOS的某些回调函数
这个是真的坑。在浏览器上跑都好好的，内嵌进app的时候发现ios打开页面后一直有一朵小菊花在loading，尽管数据已经加载完成了。切换页面也一样，除非刷新页面。那问题来了，谁的锅？又是经过一系列排查，发现这个是单页应用跟移动端那边开发的控件相互作用引起的坑。（关我毛事?）那个loading控件是移动端那边用来判断webview加载情况的，在网络请求跟数据请求时都会调用打开这个控件，然而悲剧的是关闭这个控件也就是 WebviewDidFinishLoad 函数却必须是页面有进行重载才会发起调用的，也就是说loading你是开了，但是我 单页应用 怎么来都是在一个页面上操作，自然 不会重载 ，所以也就导致了那朵小菊花一直在转，这也是为什么强制刷新的话可以关闭掉loading控件的原因。这个嘛安卓那边不会有问题，所以应该是ios开发那边的问题，就算loading也应该有个时长可以关闭，或者可以写个接口通过webview的形式让前端去手动调用关闭loading控件，都是可以的。
4.es6对于一些老旧的安卓机型和浏览器的兼容问题
这个一开始还是比较头痛的，毕竟是上了线才发现的问题，陆陆续续在后台收到一些安卓机的反馈，打开活动页面一片空白。看了下大多是安卓4.4.2还有一些4.4以下的安卓机型。这尼玛vuejs不是兼容到安卓4.4吗？所以一开始以为是axios跟mint-ui的问题，但后面发现其实不是。主要原因是对es6兼容不够到位，虽然vue-cli引入了babel对js语法进行降级，但是还是有些老旧的机型会发生各种各样的问题，这里需要引入一个叫babel-polyfill的包。所以你只需只在你引入import vue之前 import babel-polyfill进来就可以了，主要是为了让es6对个别机型做到兼容。
单页应用spa开发最佳实践(代码片段)
...，页面大概有15个左右。积累了一些开发经验在此做一些记录.本文主要从可维护性方面来考虑SPA的开发实践全站的颜色定义放在一个less或者scss的文件里，其他组件和页面import这个配置来引用颜色。示例代码：define.scss$bgColor:#fff;... 查看详情
vue单页应用在页面刷新时保留状态数据的方法(代码片段)
在Vue单页应用中，如果在某一个具体路由的具体页面下点击刷新，那么刷新后，页面的状态信息可能就会丢失掉。这时候应该怎么处理呢？如果你也有这个疑惑，这篇文章或许能够帮助到你一、问题现在产品上有个需求：单页应... 查看详情
vue2入门教程单页应用最佳实战[*****]
...门教程--------看过其他的，再看作者的，很赞vue2入门教程单页应用最佳实战： 具体在 https://github.com/MeCKodo/vue-tutorial-----------------------------通过本文，我们可以学习到许多关于vue的特性。1.了解了vue-cli脚手架2.初步对webpack... 查看详情
vue-router单页应用简单示例
...一篇博文。vue项目初始化看一下完成的效果图，很典型的单页应用。.vue后缀名的单文件组件 这里先说一下我对组件的理解。组件，顾名思义就是一组元素组成的一个原件（理解的比较浅显、直白），在Vue.js中，表现为一个... 查看详情
Vue路由器单页应用，页面是不是应该重新加载？
】Vue路由器单页应用，页面是不是应该重新加载？【英文标题】：Vueroutersinglepageapp,shouldthepagereload?Vue路由器单页应用，页面是否应该重新加载？【发布时间】：2018-05-2419:21:03【问题描述】：我有一个问题，我设置了vue路由器，... 查看详情
vue-router单页应用简单示例
我们先来理一下思路。 图1:main.js引入vue,App.vue,router/index.js文件声明要渲染的Id为app，将App.vue中的模版渲染到入口界面（就是打开localhost:8080会看到的那个页面）。 图2:App.vuerouter-view是显示路由内容的地方，比如/index.... 查看详情
vue单页应用前进刷新后退不刷新方案探讨(代码片段)
...关闭当前webview，其上一个webview就自然显示出来；但是在单页的webapp应用中，所有内容其实是在一个页面中展示的，不存在多页的情况，这时就需要前端开发来想办法实现相应的体 查看详情
vue入门----使用vue-cli搭建一个单页富应用
...学习一下vue-cli的一些基础知识，并且用vue-cli来搭建一个单页富应用。那么我们首先介绍一下什么是vue-cli? 首先要学习vue-cli，我觉得我们需要知道什么是cli吧！首先回到“原始”前端，什么是前端？无非就是html 查看详情
关于vue项目和内嵌iframe页面之间的通信问题(代码片段)
...霎时间一脸懵*啊，百度了一下，原来是那么简单，这里记录下以供下次参考//vue页面向内嵌iframe传递事件//vue页面代码letframe=document.getElementById(‘iframeId‘);//或者用vue语法letframe=this.$refs.iframeIdframe.contentWindow.postMessage(object,‘*‘);... 查看详情
Vue-Router 不在单页应用程序中重新路由（Vue/Laravel）
】Vue-Router不在单页应用程序中重新路由（Vue/Laravel）【英文标题】：Vue-RouternotreroutinginSinglePageApplication(Vue/Laravel)【发布时间】：2021-11-1222:33:20【问题描述】：我正在尝试让vue-router在Vue.js/Laravel项目中工作。我有以下简单的页面... 查看详情
vue单页应用点击某个链接，跳转到新页面的方式
<router-linkclass="goDetail":to="name:‘detail‘,params:id:item.id"target=_blank>查看详情</router-link> 查看详情
vue单页式应用(hash模式下)实现微信分享
前端微信分享的基本步骤：一.绑定域名：先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。这个不多说，微信开发的都应该清楚。二.引入js文件：在需要调用JS接口的页面引入如下JS文件，（... 查看详情
如何使用vue2构建简单的单页应用程序
参考技术Aapp很简单，使用vuejs自不必说，组件开发模块管理使用vue-loader、webpack，页面切换以及过场动画使用vue-router，在app开发过程只需关注app的数据走向即可，另外可以搭配各类UI库让你的应用更加美观，正如楼上答过的，使... 查看详情
Knockoutjs 单页应用程序绑定问题
】Knockoutjs单页应用程序绑定问题【英文标题】：KnockoutjsSinglePageApplicationbindingissues【发布时间】：2018-06-1003:52:15【问题描述】：您好，我正在使用Knockoutjs、Sammy.js和RestWebAPI开发一个.Net单页应用程序。我对这些库有点陌生，我遇... 查看详情
不构建单页应用程序时，如何构建 Vue.js 单文件组件并导入它们？
】不构建单页应用程序时，如何构建Vue.js单文件组件并导入它们？【英文标题】：HowdoyoubuildVue.jssinglefilecomponentsandimportthemwhenyou\'renotbuildingasinglepageapplication?【发布时间】：2018-12-2505:07:14【问题描述】：我正在构建一个不是单页... 查看详情
前端单页应用以及状态保持的探索
工作中对单页应用和状态保持有些研究希望和大家分享一下：我们主要探讨两个内容：单页应用、状态保持一、单页应用先说第一个：单页应用，单页应用就是指应用所有的交互都是在一个页面中进行的，当然实现方式有多种：... 查看详情
vue-路由(代码片段)
...展示不同的内容或页面用于什么场景？前端路由更多用在单页应用上,也就是SPA（单页应用程序）,因为单页应用,基本上都是前后端分离的,后端自然也就不会给前端提供路由。什么是单页应用？SPA是一种特殊的Web应用。它将所有... 查看详情
单页应用程序路由
】单页应用程序路由【英文标题】：SinglePageApplicationRouting【发布时间】：2019-03-0519:17:48【问题描述】：现代单页应用程序使用的路由机制不必依赖片段或额外的url参数，而只需利用url路径。浏览器如何知道何时向服务器请求资... 查看详情