vue
文章平均质量分 85
人称~
受想行识,亦复如是。
展开
-
Hbuilderx uniapp 离线打包Android studio
最近开发uniapp 安卓端,基于以下原因考虑用离线打包1. hbuilderx云打包繁忙时排队时间比较久2.云打包需要上传代码,对于安全性较高公司不太适用原创 2022-06-17 14:33:01 · 3844 阅读 · 0 评论 -
Vue-cli3+Mock基础配置
在前端这一块,很多时候需要用到Mock数据,那本文就这一篇文章说一说最近很火的vue-cli3基础配置以及如何配置mock数据吧(如果需要自己手动配置webpcak3+vue和webpcak4+vue工程的请看我以前文章)。1.安装@vue/cli脚手架npm install -g @vue/cli2.创建一个项目> vue create projectName然后根据...原创 2019-07-19 16:57:58 · 2704 阅读 · 0 评论 -
Vue的click事件防抖和节流处理
函数防抖定义:多次触发事件后,事件处理函数只执行一次,并且是在触发操作结束时执行。在vue中对click添加防抖处理const on = Vue.prototype.$on// 防抖处理Vue.prototype.$on = function (event, func) { let timer let newFunc = func if (event ==...原创 2019-06-10 17:53:36 · 8846 阅读 · 7 评论 -
Vue动态添加路由实现菜单和数据权限管理
前言在我们做一个管理系统的时候,一般比较重要也是最基础的地方就是权限管控这部分。权限管理在来说基本有两个方面:一、控制页面级访问权限; 页面访问权限控制实质上是控制页面是否显示,这里有两种方法: 1、添加所有路由和菜单,当用户在浏览器输入菜单路径时,不在权限内的显示无权限; 2、动态添加只在权限内的菜单和路由,当用户输入url绕过菜单时,显示404页...原创 2019-06-14 17:49:26 · 3753 阅读 · 0 评论 -
vue项目vscode常用插件
对于很多使用vscode编写vue项目的新手同学来说,可能不知道使用什么插件,这里简单说一下我常用的几款插件。1. veturvetur能够实现在 .vue 文件中:语法错误检查,包括 CSS/SCSS/LESS/Javascript/TypeScript语法高亮,包括 html/jade/pug css/sass/scss/less/stylus js/tsemmet 支持代码...原创 2019-05-13 17:15:49 · 24477 阅读 · 4 评论 -
webpack手动搭建vue项目(八)—— 写单元测试
这篇文章的前提是你已经搭建好了一个vue+elementui+mockjs+karma+mocha+chai的项,编写单元测试可以参考这个教程。import { expect } from 'chai'import { shallowMount, createLocalVue } from '@vue/test-utils'import example from '所需编写组件的路径'...原创 2019-05-21 15:23:07 · 195 阅读 · 0 评论 -
webpack手动搭建vue项目(七)—— 单元测试覆盖率
1.安装依赖>npm installkarma-coveragecross-envbabel-plugin-istanbul --save-dev2.更新你的.babelrc文件添加如下:"env": { "test": { "plugins": ["istanbul"] } }3.更新karma.conf.jsmodule.expo...原创 2019-05-15 18:44:51 · 499 阅读 · 0 评论 -
webpack手动搭建vue项目(六)—— Karma+Mocha+chai单元测试
Karma 是一个启动浏览器运行测试并生成报告的测试运行器。我们会使用 Mocha 框架撰写测试,同时使用 chai 作为断言库。参考1.安装依赖>npm install --save-dev @vue/test-utils karma karma-chrome-launcher karma-mocha karma-sourcemap-loader karma-spec-repor...原创 2019-05-15 16:51:37 · 528 阅读 · 0 评论 -
webpack手动搭建vue项目(五)—— 引入mockjs
在我们实际开发中,以前需要等待后台开发完成才能联调,现在只需先协商好数据结构字段等,然后引入mockjs,就可以先一步开发,另外mockjs在单元测试的时候也很重要。1.安装mockjs>npm install mockjs --save-dev2.添加mock目录|---src/| |---index.js||---mock/| |---demo //...原创 2019-05-15 16:04:26 · 1176 阅读 · 0 评论 -
webpack手动搭建vue项目(四)—— vscode配合vetur eslint统一代码风格
1.代码风格问题1.由于 每个人编写代码习惯不一致,而且所用编辑器不同,导致项目代码不能形成统一风格。2.vscode的默认的代码格式化ctrl+shift+f无法通过eslint的代码风格检查是一个非常蛋疼的问题2.解决方案本文前置条件为通过webpack手动搭建vue项目完成前三部。参考地址1.安装所需插件使用vscode编辑器,安装eslint、vetur、Edi...原创 2019-05-15 14:37:27 · 296 阅读 · 0 评论 -
webpack手动搭建vue项目(三)—— 配置eslint
1.安装eslint> npm install eslint --save-dev> eslint --init?How would you like to configure ESLint?> use a pooular style guide? Which style guide do you want to follow?>Standard...原创 2019-05-15 13:48:14 · 619 阅读 · 0 评论 -
webpack手动搭建vue项目(二)—— 创建vue+elementui项目
1.安装依赖>npm install vue vuex vue-router vue-resource element-ui --save-dev>npm install babel-cli babel-core babel-loader babel-polyfill --save-dev>npm install css-loader file-loader st...原创 2019-05-14 17:29:39 · 499 阅读 · 0 评论 -
webpack手动搭建vue项目(一)—— 安装环境和基础配置
1.安装node和webpack 安装node教程很多都有这里就不详细说了,参考菜鸟教程,本人用的node版本为v8.11.2,npm版本为5.6.0,后面安装webpack,输入npm install webpack -g ,安装完成后输入webpack -v查看版本,如果输出说明安装成功。2.创建项目目录生成配置1.首先创建目录 > mkdir projectN...原创 2019-05-14 15:24:20 · 765 阅读 · 0 评论