前端周总结2- git提交规范

踩过的坑

1. 页面中有定时器一定要清除，已经是第二次遇到了。在前一个页面加了定时器自动跳转，但用户在倒计时结束之前点了返回，在返回的页面会自动跳转一次，原因就是前一个页面的定时器没有清除
2. v-if与v-show,有个页面用了一个封装的组件，该组件是默认组件加载时开始倒计时，刚开始用v-show条件判断的，我的倒计时是5s，但是每次进页面都是从4s开始计时的，找了很久，才发现原因是用了v-show，在父页面加载时组件就加载并开始执行了，并没有等到v-show为真这一条件才开始，换成v-if就可以了.

想要留下的代码

1. 判断是否在移动端

isMobile() {
  if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
    this.mobile = true
  } else {
    this.mobile = false
  }
}

学到的知识

1. git commit 规范 commitizen包

npm install -g commitizen  使用git cz 提交

2. 使用husky可规范commimt提交

package.json中配置一下

{
  
  "scripts": {
   
    "lint": "eslint . --ext .js,.vue --fix",
    "lint-jenkins": "eslint . --ext .js,.vue -f jslint-xml -o output.xml"
  },
  
 
  "devDependencies": {
    "eslint": "^4.19.1",
    "eslint-config-prettier": "^2.9.0",
    "eslint-config-standard": "^11.0.0",
    "eslint-plugin-import": "^2.11.0",
    "eslint-plugin-node": "^6.0.1",
    "eslint-plugin-prettier": "^2.6.0",
    "eslint-plugin-promise": "^3.7.0",
    "eslint-plugin-standard": "^3.1.0",
    "eslint-plugin-vue": "^4.5.0",
    "husky": "^1.0.0-rc.13",
    "lint-staged": "^7.1.1",
    "prettier": "^1.12.1"
  },
 
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged",
      "commit-msg": "node scripts/verify-commit-msg.js"
    }
  },
  "lint-staged": {
    "*.{js,vue}": [
      "npm run lint",
      "git add"
    ]
  }
}

verify-commit-msg.js

const chalk = require('chalk')
const msgPath = process.env.HUSKY_GIT_PARAMS
const msg = require('fs')
  .readFileSync(msgPath, 'utf-8')
  .trim()

const commitRE = /^(revert: )?(feat|fix|polish|docs|style|refactor|perf|test|workflow|ci|chore|types|build)(\(.+\))?: .{1,50}/

if (!commitRE.test(msg)) {
  console.log()
  console.error(
    `  ${chalk.bgRed.white(' ERROR ')} ${chalk.red(
      `invalid commit message format.`
    )}\n\n` +
      chalk.red(
        `  Proper commit message format is required for automated changelog generation. Examples:\n\n`
      ) +
      `    ${chalk.green(`feat(compiler): add 'comments' option`)}\n` +
      `    ${chalk.green(
        `fix(v-model): handle events on blur (close #28)`
      )}\n\n` +
      chalk.red(`  See .gitlab/COMMIT_CONVENTION.md for more details.\n`) +
      chalk.red(
        `  You can also use ${chalk.cyan(
          `git cz`
        )} to interactively generate a commit message.\n`
      )
  )
  process.exit(1)
}