一、创建Vue项目eslint-standard

vue create eslint-standard

二、创建.eslintrc.*

  • 删除package.json中的eslintConfig配置

  • 我们创建.eslintrc.js

// .eslintrc.js
module.exports = {
root: true,
env: {
node: true,
browser: true,
es6: true
},
extends: [
"plugin:vue/essential",
"eslint:recommended"
],
parserOptions: {
"parser": "babel-eslint"
},
rules: {} // 用来自定义一些符合个人或者团队的规则
}
  • 安装配置Git钩子插件husky
// 安装husky
npm install husky --save-dev // 安装lint-staged,只对修改的文件进行check
npm install lint-staged --save-dev //配置package.json,添加`husky`配置
{
"husky": {
"hooks": {
"pre-commit": "lint-staged",
}
},
"lint-staged": {
"src/**/*.{js,vue}": [
"eslint --fix",
"git add"
]
}
}

Vue+ESLint+Git钩子函数pre-commit配置教程的更多相关文章

  1. Vue生命周期 钩子函数和组件传值

    Vue生命周期 钩子函数 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等. 同时在这个过程中也会运行一 ...

  2. VueRouter和Vue生命周期(钩子函数)

    一.vue-router路由 1.介绍 vue-router是Vue的路由系统,用于定位资源的,在页面不刷新的情况下切换页面内容.类似于a标签,实际上在页面上展示出来的也是a标签,是锚点.router ...

  3. vue之router钩子函数

    模块一:全局导航钩子函数 1.vue router.beforeEach(全局前置守卫) beforeEach的钩子函数,它是一个全局的before 钩子函数, (before each)意思是在 每 ...

  4. vue父子组件钩子函数的执行顺序

    加载渲染过程 父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount-& ...

  5. vue中的钩子函数

    什么是vue的钩子函数? Vue 实例在被创建时,会经过一系列的初始化过程,初始化过程中会运行一些函数,叫做生命周期钩子函数,通过运用钩子函数,用户在可以在Vue实例初始化的不同阶段添加自己的代码,以 ...

  6. Vue -自定义指令&钩子函数

    除了核心功能默认内置的指令,Vue也允许注册自定义指令 页面加载后,让文本框自动获取焦点,原生js做法是获取文本框元素后调用focus()方法,但Vue不建议手动操作DOM元素,所以此时要自定义指令 ...

  7. vue路由的钩子函数和跳转

    首页可以控制导航跳转,beforeEach,afterEach等,一般用于页面title的修改.一些需要登录才能调整页面的重定向功能. beforeEach主要有3个参数to,from,next. t ...

  8. vue中的钩子函数的理解

    接下来我们对几个钩子函数进行解释 beforeCreated:这个钩子函数实在vue实例创建后,触发的.这个时候还没有进行data里的数据监听和事件的初始化 其实大家很多时候都会在created钩子函 ...

  9. Vue系列之 => 钩子函数生命周期

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. JavaWeb学生公寓(宿舍)管理系统源码

    开发环境: Windows操作系统开发工具: MyEclipse+Jdk+Tomcat+MySQL数据库 运行效果图 源码及原文链接:https://javadao.xyz/forum.php?mod ...

  2. 15.python文件(file)方法详解

    文件的基本操作 文件读写: 文件的读写满足以下3个步骤: 1).打开文件 2).操作数据(读.写) 3).关闭文件 --> 不要忘记 1).打开文件: python的open() 方法用于打开一 ...

  3. 数据分析----天气预报走向(pygal)

    #!usr/bin/env python #-*- coding:utf-8 _*- """ @author:Administrator @file: 可视化天气预报.p ...

  4. Codeforces Round #340 (Div. 2) E XOR and Favorite Number 莫队板子

    #include<bits/stdc++.h> using namespace std; <<; struct node{ int l,r; int id; }q[N]; in ...

  5. 1-2.Kubectl命令行工具

    1.kubectl用法 $~: kubectl [command] [TYPE] [NAME] [flags] [command] 子命令.用于操作Kubernetes集群资源对象. 可取值:[cre ...

  6. 小程序上拉触底&下拉加载

    data: { pageNo: 1,//当前页 pageSize: 10,//每页条数 count:'',//总条数 orderList: [], }, onLoad: function () { v ...

  7. Interger对象不要用==进行比较

    为了更好的空间和时间性能,Integer会缓存频繁使用的数值,数值范围为-128到127,在此范围内直接返回缓存值. IntegerCache.low 是-128,IntegerCache.high是

  8. Uva1363(余数性质/减少枚举量)

    题意: 输入正整数n和k(范围均为1e9),求∑(k mod i),i从1~n 解法: 首先这道题直接暴力亲测会超时. 之后我们写几组数据之后可以发现当k/i的商相同的时候他们的余数成一个等差数列,而 ...

  9. Spark学习之路 (二十七)图简介[转]

    test test test test test test test test test 图 基本概念 图是由顶点集合(vertex)及顶点间的关系集合(边edge)组成的一种数据结构. 这里的图并非 ...

  10. gulp常用插件之gulp-postcss使用

    更多gulp常用插件使用请访问:gulp常用插件汇总 ** gulp-postcss**这是一款通过多个插件通过管道传递CSS,但是仅解析一次CSS. 更多使用文档请点击访问gulp-postcss工 ...