更新简单类库脚手架配置

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...

感谢

欢迎联系我

相关推荐
编程社区管理员3 小时前
React 发送短信验证码和验证码校验功能组件
前端·javascript·react.js
全马必破三3 小时前
React“组件即函数”
前端·javascript·react.js
三思而后行,慎承诺3 小时前
React 底层原理
前端·react.js·前端框架
座山雕~3 小时前
html 和css基础常用的标签和样式
前端·css·html
灰小猿4 小时前
Spring前后端分离项目时间格式转换问题全局配置解决
java·前端·后端·spring·spring cloud
im_AMBER5 小时前
React 16
前端·笔记·学习·react.js·前端框架
02苏_5 小时前
ES6模板字符串
前端·ecmascript·es6
excel5 小时前
⚙️ 一次性警告机制的实现:warnOnce 源码深度解析
前端
excel5 小时前
Vue SFC 样式编译核心机制详解:compileStyle 与 PostCSS 管线设计
前端
excel5 小时前
🧩 使用 Babel + MagicString 实现动态重写 export default 的通用方案
前端