前言 electron-vue脚手架搭建的项目,在开发阶段可能你注意不到项目启动慢的问题,但是在build 生成的exe可执行文件,启动后,要反应很久才能进入到app.vue 中加载的页面,体验性很差. 正文 针对上诉问题,产生的原因是在渲染进程加载vue的时候,特别慢,为了提高用户体验,我们的项目可以在启动的时候添加一个loading动画,然后再进入app.vue的页面. 实现思路 我们可以通过一个单独的启动窗口来创建loading页面,在项目中其他准备工作未完成时出现在用户的视野中给用户一定…
为什么要给 VUE 项目添加 PWA 为什么要添加?因为不管是部署在 IIS,还是 nginx,每次应用部署后,再次访问因为旧的 js 已经不存在,所以页面访问的时候会整个报错,报错的结果就是一个白屏. 为了解决这个问题,我的解决方案是使用 PWA ,这样就可以将 js 缓存到本地,再次发布后,service-worker.js 会使旧的 js 失效,重新请求并缓存 js. 如果对于问题这个有更好的解决方案,务必请大佬指定一二 安装 PWA 的相关依赖包 yarn 安装 yarn add sw-…
如何为你的 Vue 项目添加配置 Stylelint 现在已经是 9102 年了,网上许多教程和分享帖都已经过期,照着他们的步骤来会踩一些坑,如 stylelint-processor-html 已经不再维护,以及 --fix 之后 .vue 文件只剩下 <style> 部分等.我在踩完坑跑通出满意的效果后,维护一份新的指引,以备后续项目使用,顺便分享一下. 为什么选择用 stylelint ? 这个问题有两层含义,一是为什么要使用这个样式代码风格检查工具,二是与其他工具相比,为什么选择 st…
0. 直接上 预览链接 + 效果图 Vue项目添加动态浏览器头部title 1. 实现思路 ( 1 ) 从路由router里面得到组件的title ( 2 ) title存vuex (本项目已经封装h5的sessionStorage和localStorage也可以存在这里面) ( 3 ) 设置 title (1)从路由router里面得到组件的title 在 router.beforeEach((to, from, next) => {} 里面 const browserHeaderTitle…
文章原址:https://www.cnblogs.com/yalong/p/11714393.html 背景介绍: 以前写的公共组件,后来需要添加一些功能,添加了好几次,每次修改我都要测试好几遍保证以前的功能不受影响,有次我测试遗漏导致组件出现bug,而且由于是公共组件,我每次修改还得让其他小伙伴更新组件,很是麻烦,所以一定要写测试, 对自己负责,也是对他人负责! 前端测试介绍 1.单元测试(unit测试)单元测试是把代码看成是一个个的组件,从而实现每一个组件的单独测试,测试内容主要是组件内每一…
在Xcode7下创建的项目,由于某个原因,Xcode7添加启动图有点不一样.Xcode7与Xcode6不一样的地方在于:Xcode6的LaunchScreen.xib改成了LaunchScreen.storyboard 如果你还是像以前那样添加启动图,Xcode将会报出一个警告.如何解决? 第一步打开你的assets文件,并点击左下的+按钮,添加LaunchImage.然后按要求,导入不同分辨率的图片.如下图:   导入不同分辨率的图片 第二步修改下图箭头处位置, 将Launch Images…
用 Jest 测试单文件组件 1.安装 Jest 和 Vue Test Utils npm install --save-dev jest @vue/test-utils 2.配置 package.json // package.json { "scripts": { "test": "jest" } } 3.需要安装和配置 vue-jest 预处理器 npm install --save-dev vue-jest 4.在package.json…
链接地址:https://blog.csdn.net/aa792978017/article/details/82939483 Vue.js是现在比较优秀的Web前端框架,下面开始从零开始搭建一个Vue项目.流程如下: 一.安装node.js  1.进入node.js官网下载相应安装包:https://nodejs.org/en/ 安装过程没有什么要注意的地方,直接安装到自己想安装到的目录里面就可以了 2.安装完成以后,打开命令行,输入node -v  来判断是否安装成功 3.在安装node的时…
最近有个Vue项目中会偶尔出现Loading chunk {n} failed的报错,报错来自于webpack进行code spilt之后某些bundle文件lazy loading失败.但是这个问题的根本原因没有被找到,因为这个问题出现的偶然性太高了,而且有的手机上会出现,有的不会,用模拟器不会出现,用真机又会出现,不知道是网络原因还是webpack的bug.在github.stackoverflow等各种地方也找不到原因和解决方案,这是github上关于这个问题的讨论: Loading ch…
electron可以结合前端的很多框架来进行快速的开发.在这里只讲一种electron结合vue并且使用前端的elementui来快速搭建一个项目页面. 第一步.创建electron 以管理员身份运行cmd,想好要把项目存放的位置,并cd进去(我一般关于项目的任何东西都不会用中文,代码注释除外). 在cmd中运行:   vue init simulatedgreg/electron-vue eleproject01    (1)eleproject01是项目的名字(不能有大写字母) (2)sas…