跳到主要内容

项目构建

项目构建常用库

Gzip

webpack 依赖库
yarn add compression-webpack-plugin -D
由于版本更新问题,webpack4 使用时需安装低版本
yarn add compression-webpack-plugin@6. -D

使用方案

// umi & dumi
{
chainWebpack(config, { webpack }) {
// 生产模式开启
config.plugin('compression-webpack-plugin').use(
new CompressionWebpackPlugin({
// filename: 文件名称,这里我们不设置,让它保持和未压缩的文件同一个名称
algorithm: 'gzip', // 指定生成gzip格式
test: new RegExp(`.(${['js', 'css'].join('|')})$`), // 匹配哪些格式文件需要压缩
threshold: 1024 * 10, //对超过10k的数据进行压缩
minRatio: 0.6, // 压缩比例,值为0 ~ 1
})
);
}
}

commitizen

  • 项目规范提交库
  • 安装后需执行一次commitizen init cz-conventional-changelog --save-dev --save-exact进行初始化
  • 初始化成功后可git-cz进行提交
  • 初始化命令主要进行了 3 件事情
    1.在项目中安装 cz-conventional-changelog 适配器依赖
    2.将适配器依赖保存到 package.json 的 devDependencies 字段信息
    3.在 package.json 中新增 config.commitizen 字段信息,主要用于配置 cz 工具的适配器路径:
"devDependencies": {
"cz-conventional-changelog": "^2.1.0"
},
"config": {
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
}

cz-customizable

  • 通过在根目录编写.cz-config.js文件进行自定义git-cz项目提交格式
  • 一份示例
'use strict';

module.exports = {
types: [
{ value: '特性', name: '特性: 一个新的特性' },
{ value: '修复', name: '修复: 修复一个Bug' },
{ value: '文档', name: '文档: 变更的只有文档' },
{ value: '格式', name: '格式: 空格, 分号等格式修复' },
{ value: '重构', name: '重构: 代码重构,注意和特性、修复区分开' },
{ value: '性能', name: '性能: 提升性能' },
{ value: '测试', name: '测试: 添加一个测试' },
{ value: '工具', name: '工具: 开发工具变动(构建、脚手架工具等)' },
{ value: '回滚', name: '回滚: 代码回退' },
],
scopes: [{ name: '个人博客' }, { name: '力扣题解' }, { name: '应用合集' }, { name: '配置文件' }],
// it needs to match the value for field type. Eg.: 'fix'
/*
scopeOverrides: {
fix: [
{name: 'merge'},
{name: 'style'},
{name: 'e2eTest'},
{name: 'unitTest'}
]
},
*/
// override the messages, defaults are as follows
messages: {
type: '选择一种你的提交类型:',
scope: '选择一个scope (可选):',
// used if allowCustomScopes is true
customScope: 'Denote the SCOPE of this change:',
subject: '短说明:\n',
body: '长说明,使用"|"换行(可选):\n',
breaking: '非兼容性说明 (可选):\n',
footer: '关联关闭的issue,例如:#31, #34(可选):\n',
confirmCommit: '确定提交说明?',
},

allowCustomScopes: true,
allowBreakingChanges: ['特性', '修复'],
// limit subject length
subjectLimit: 100,
};

@commitlint/cli

commit 格式校验器

@commitlint/config-conventional

  • commit angular 格式校验规则
  • 在项目中新建commitlint.config.js文件并设置校验规则
module.exports = {
extends: ['@commitlint/config-conventional'],
};

commitlint-config-cz

  • 如果是使用 cz-customizable 适配器做了破坏 Angular 风格的提交说明配置,那么不能使用@commitlint/config-conventional规则进行提交说明校验
  • 可以使用commitlint-config-cz对定制化提交说明进行校验。然后在项目中新建commitlint.config.js文件并设置校验规则加入 commitlint 校验规则配置:
module.exports = {
extends: ['cz'],
};

conventional-changelog-cli

  • 生成CHANGELOG.md文件
  • 追加conventional-changelog -p angular -i CHANGELOG.md -s
  • 覆盖conventional-changelog -p angular -i CHANGELOG.md -s -r 0
  • 使用 cz-customizable 自定义配置后破坏 angular 规则后会失效,需在 cli 中删除 angular 配置

standard-version

  • 更新版本号 github
  • 常用命令
    • standard-version -r major
    • standard-version -r minor
    • standard-version -r patch

semver

更新版本号

import { minimist, pkg, semver, enquirer, chalk, fs, resolve } from '../utils';

const args = minimist(process.argv.slice(2));
const currentVersion = pkg.version;

const preId =
args.preid || (semver.prerelease(currentVersion) && semver.prerelease(currentVersion)?.[0]);
const versionIncrements: semver.ReleaseType[] = [
'major',
'minor',
'patch',
...((preId ? ['prepatch', 'preminor', 'premajor', 'prerelease'] : []) as semver.ReleaseType[]),
];
const inc = (i: semver.ReleaseType) => semver.inc(currentVersion, i, preId);
async function main() {
const { release } = (await enquirer.prompt({
type: 'select',
name: 'release',
message: '选择下一版本',
choices: versionIncrements.map(i => `${i} (${inc(i)})`),
})) as { release: string };
const targetVersion = release.match(/\((.*)\)/)![1];
console.log(chalk.blue(`下一版本 : ${targetVersion}`));
pkg.version = targetVersion;
fs.writeFileSync(resolve('package.json'), JSON.stringify(pkg, null, 2) + '\n');
}
main();