接上一篇文章 使用turborepo搭建企业级monorepo项目(开篇) - 掘金 (juejin.cn)
在传统的项目结构中,每次初始化一个新项目都可能显得相当繁琐,尤其是在处理各种格式化和配置文件时。通常,我们需要花费大量时间仅仅在复制和粘贴一堆依赖项。为了解决这个问题,我们可以考虑将这些通用配置提炼出来,并将它们存放在一个专门的文件夹中。这样做不仅可以简化新项目的初始化过程,还有助于统一管理依赖项和它们的升级。
例如,我们可以创建一个名为 config
的文件夹,用于存放我们的相关配置文件。这个文件夹需要在我们的 pnpm-workspace
文件中。随着公司业务的稳定和成熟,我们甚至可以考虑将这些配置包提炼到公司自己的 npm 上,这样在启动新项目时,就无需再安装大量依赖,同时也能更好地管理依赖的升级。
在 pnpm-workspace.yaml
文件中,我们可以这样配置:
yamlCopy code
packages:
- "apps/*"
- "packages/*"
- "config/*"
通过这种方式,我们可以大大简化项目的初始化和维护过程,使其更加高效和一致。
这样的结构不仅优化了项目的管理,还为团队成员提供了一个清晰、统一的配置参考,有助于提高整体的开发效率和项目的可维护性。
eslint-config
分成了几个文件 其中base是最基础的ts配置,base-ts添加了 @typescript-eslint/recommended-requiring-type-checking这个包,静态检查能力更强了。但是报错提示也就更多了 strict主要是本项目config这些内部工具使用。另外添加了airbnb的规范,不喜欢的可以删掉
prettier-config
可以给每个子项目添加单独的.prettierrc.js也可以在项目根目录下配置一份统一的。
lint-staged-config
react或nest
module.exports = {
'*.{js,jsx,ts,tsx}': ['prettier --write', 'eslint --fix'],
// '*.{ts,tsx}': ['tsc --noEmit --skipLibCheck'],
'{!(package)*.json,*.code-snippets,.!(browserslist)*rc}': ['prettier --write--parser json'],
'package.json': ['prettier --write'],
'*.{scss,less,styl,html}': ['prettier --write', 'stylelint --fix'],
'*.md': ['prettier --write'],
}
vue
module.exports = {
// '*.{js,jsx,ts,tsx}': ['prettier --write', 'eslint --fix', 'vue-tsc --noEmit --skipLibCheck'],
'*.{js,jsx,ts,tsx}': ['prettier --write', 'eslint --fix'],
'{!(package)*.json,*.code-snippets,.!(browserslist)*rc}': ['prettier --write--parser json'],
'package.json': ['prettier --write'],
'*.vue': ['prettier --write', 'eslint --fix', 'stylelint --fix'],
'*.{scss,less,styl,html}': ['prettier --write', 'stylelint --fix'],
'*.md': ['prettier --write'],
}
为了区分vue和其他ts项目单独做了区分
release-it
const version = '${version}'
const packageName = process.env.npm_package_name
console.log(packageName, 'packageName')
const scope = packageName?.split('/')[1]
/**
* @see https://medium.com/valtech-ch/monorepo-semantic-releases-db114811efa5 https://github.com/release-it/release-it
* @type {{github: {release: boolean, releaseName: string}, git: {commitMessage: string, requireCommits: boolean, commitsPath: string, tagName: string, requireCommitsFail: boolean, push: boolean}, plugins: {"@release-it/conventional-changelog": {path: string, preset: string, infile: string, gitRawCommitsOpts: {path: string}}}, npm: {publish: boolean, versionArgs: string[]}, gitlab: {release: boolean, releaseName: string}, hooks: {"before:git:release": string[]}}}
*/
module.exports = {
plugins: {
'@release-it/conventional-changelog': {
preset: 'angular',
infile: 'CHANGELOG.md', //用于 conventional-changelog.infile 设置自定义文件。默认为 "CHANGELOG.md"。
path: '.',
gitRawCommitsOpts: {
path: '.',
},
},
},
git: {
push: true, //用于 git.push 设置是否应推送到远程。默认为 true。
tagName: `${packageName}-v${version}`, //用于 git.tagName 设置自定义标签名称。默认为 "${version}"。
commitsPath: '.', //用于 git.commitsPath 设置自定义路径。默认为 "."。
commitMessage: `feat(${scope}): released version v${version} [no ci]`, //用于 git.commitMessage 设置自定义提交消息。默认为 "chore(release): ${version}"。
requireCommits: true, //用于 git.requireCommits 设置是否需要提交。默认为 true。
requireCommitsFail: false, //用于 git.requireCommitsFail 设置是否应在没有提交时失败。默认为 false。
},
npm: {
publish: true,
versionArgs: ['--workspaces false'], //用于 npm.versionArgs 设置自定义参数。默认为 ["--force"]。
},
github: {
release: true, //用于 github.release 设置是否应发布到 GitHub。默认为 false。
releaseName: `${packageName}-v${version}`,
},
gitlab: {
release: false,
releaseName: `${packageName}-v${version}`,
},
hooks: {
'before:git:release': ['mvm-update', 'git add --all'],
},
}
需要注意的是如果公司的是gitlub自建的项目gitlab这个选项的release设置为false就行了。其他的都设置为false
示例
badlym/liuchengjin-monorepo (github.com)