当前位置: 首页 > Web前端 > HTML

前端项目代码提交规范化实践

时间:2023-03-28 01:50:52 HTML

commitizen规范提交//全局安装commitizenglobaladdcommitizen//初始化commitizeninitcz-conventional-changelog--save--save-exact执行后会生成如下配置package.json{..."config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},}也可以安装中文包yarnaddcz-conventional-changelog-zh-D并修改配置,可自定义:"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog-zh","defaultType":"[Newfeatures]]","types":{"[Newfeatures]":{"description":"Newfeatures,newrequirements","title":"Features"},"[Bugfixes]":{"description":"Fixbug,在线、测试、验收阶段的bug","title":"BugFixes"},"[DocumentModifications]":{"description":"文档增删改","title":"Documentation"},"[StyleModifications]":{"description":"StyleModifications(whitespace,formatting,missingsemicolons,etc.)","title":"Styles"},"[代码重构]":{"description":"既不修复bug也不增加新特性的改动","title":"代码重构"},"[性能优化]":{"description":"性能优化","title":"性能改进"},"[测试代码]":{"description":"添加测试","title":"测试"},"[编译代码]":{"description":"更改影响构建系统或外部依赖项的(示例范围:gulp、broccoli、npm)","title":"Builds"},"[ContinuousIntegration]":{"description":"CI配置文件和脚本变更的实施至(示例范围:Travis、Circle、浏览器Stack,SauceLabs)","title":"ContinuousIntegrations"},"[Othercommits]":{"description":"Modificationsotherthansrcdirectoryortestfiles","title":"杂务"},"[还原更改]":{"description":"还原为历史版本","title":"还原"},"[修改冲突]":{"description":"修改冲突","title":"冲突"},"[字体修改]":{"description":"字体文件更新","title":"字体"},"[删除文件]":{"description":"删除文件","title":“删除文件”},“[隐藏文件]”:{“描述”:“隐藏文件”,“标题”:“隐藏文件”}}}}为了提交方便,在package.json中添加scripts的配置:{"scripts":{..."commit":"gitadd-A&&gitcz&&gitpush",}}standard-version自动化版本控制//安装yarnaddstandard-version-D添加脚本配置{"scripts":{..."standard":"standard-version"}}编写自定义脚本来控制版本号升级//scripts/版本。js/*eslint-disable*/constexec=require('child_process').execconstinquirer=require('inquirer')conststates={major:'版本升级(新功能与旧版本不兼容)',minor:'Featureupdate(添加新功能或增强功能时)',patch:'Fixpatch(修复一般bug时)',skip:'跳过(注意!未完成请只选此项)'}inquirer.prompt([{type:'list',name:'version',message:'请选择要升级的版本号类型:',choices:Object.keys(states).map(k=>`${k}:${states[k]}`)}]).then(({version})=>{consttype=version.split(':')[0]if(type!=='skip'){exec(`npmrunstandard----release-as${type}`)console.log('更新版本号.....')}}).catch((err)=>{console.error(err)process.exit(1)})在package.json的scripts中修改commit配置,添加update:version命令:{"scripts":{..."commit":"gitadd-A&&gitcz&&npmrunupdate:version&&gitpush","update:version":"node./scripts/version.js"}}运行commitizen提交后,会执行脚本文件version.js更新版本,如果没有选择skip,则运行标准命令,根目录下会生成CHANGELOG.md(版本更新日志文件)。集成Husky和lint-stagedHusky可以在git提交代码前后执行一系列的githooks来更新代码、文件等。预设检查,一旦检查失败,可以阻止当前代码提交,避免不规范项目中出现的代码和git提交。lint-staged是一个设计用于在通过git提交代码之前对暂存区的代码进行一系列格式化的工具。lint-staged与githooks一起使用时,可以在git提交前将lint-staged命令添加到hook中,这样就可以在提交代码前对要提交的代码进行格式化,成功后再提交代码。//安装yarnaddhusky-Dyarnaddlint-staged-D//同时集成npxmrm@2lint-staged执行命令后,你会看到你的包里多了一个lint-staged配置项。json,并且在根目录下多了一个.husky目录,里面有pre-commit文件,里面有最基本的命令:npxlint-staged。我们可以修改lint-staged的配置项来达到我们校验代码的目的,比如eslint,stylelint等{..."lint-staged":{"*.{js,jsx,ts,tsx,vue}":["eslint--cache--fix","vue-cli-servicelint"]}}可以创建其他hooksgithooks,并在文件中写入shell脚本//添加其他hooksnpxhuskyadd[fileName]

猜你喜欢