更新简单类库脚手架配置

juejin.cn/post/684490... 以前做的脚手架配置,前几年对其进行了一次升级

  1. typescript support
  2. pnpm package manager
  3. build tools
  4. prettier / eslint setting
  5. test supports
  6. github action supports

起言

4 年前还是 js 的工作环境,4 年后几乎已经全 typescript 的工作环境了,随着而来的是脚手架的升级,两年前进行了一波升级,现在将经验分享。 利用预置的库 template 设置方便我们快速的构建插件能力

typescript support

ts 的支持现在可以说很普遍,类型标注也确实现在是包功能的基本需求。 我基本使用的 tsconfig 设置与初始化基本无异,核心记得开启 strict 即可。

pnpm package manager

包管理工具基本上也是个人的喜爱,pnpm 轻量且快速。 如果限制环境的话,记得将 package.json 的 packageManager 进行限制。

build tools

比起 4 年前,可以说这几年工具的发展都是往简便走的,巴不得你直接什么都不用配置,直接运行,像 unbuild / tsup / bunchee 甚至 vite lib mode 都是用来开发包很好的构建方式。 我这里是选择 tsup, 其底层实际上也是 rollup 只是帮助我们免去了大量的 rollup 配置。

prettier / eslint settings

现在流行自己构建自己的 setting,参考类似 github.com/antfu/eslin... 有兴趣的朋友可以自己构建一个。我这边一般用 alloy-team eslint 或者 antfu 的。

test support

从早年的 mocha 到 jest 到 ava 再到现在 vitest。 现在我基本包基本使用 vitest(esm支持度, vite 无缝),e2e 基本是使用 cypress。

github action

以前的时候 github action 还没那么流行,但是现在已经是标配了 我一般几个阶段使用

  1. push trigger test
  2. release

push 触发 action test, 监听 push 时机

yaml 复制代码
on:
	push:	
		branches: [main]
	pull_request:
		branches: [main]

发版本 release 一般的流程是 bumpp(antfu的工具,帮助我们进行打 tag 流程)

shell 复制代码
git push -u origin main

bumpp

pnpm run build

pnpm release

我们在 package.json script prepublishOnly 中进行 pnpm run build 处理即可。

我们将以上的步骤放置到 release.yml 中 github.com/ZWkang/ts-l...

感谢

欢迎联系我

相关推荐
qq4356947013 分钟前
Vue04
前端·vue.js
我是真菜1 小时前
彻底理解js中的深浅拷贝
前端·javascript
江畔柳前堤1 小时前
github实战指南07-CLI 与高级技巧
前端·人工智能·chrome·深度学习·github·caffe·issue
kisdiem2 小时前
ReAct:让大模型一边推理,一边行动
前端·react.js·前端框架
西部荒野子2 小时前
JS 如何跑进两个原生世界
前端
RANxy2 小时前
AntV 入门系列第一篇:从零开始的数据可视化之旅
前端
小小小小宇3 小时前
前端 WebRTC 全解析与应用
前端
华玥3 小时前
优化滚动列表,使用虚拟滚动
前端
小小小小宇3 小时前
前端 WebAssembly 全解析与应用
前端
huangdong_3 小时前
京东商品图片视频批量下载与m3u8视频合并技术完整实现方案
大数据·前端·数据库