0.0.8 • Published 11 months ago
joywise-lib v0.0.8
joywise-lib <ts类库打包脚手架>
脚手架工程
仓库拉取脚手架代码
git clone <repo address>
脚手架目录
# 工程部分文件说明 <lib> # 类库代码 <test> # 单元测试 <types> # 类库对应类型声明文件 <.npmignore> # 设置 npm 发布时候需要忽略的文件,类似 .gitignore 文件 <jest.config.json> # 单元测试配置文件 <tsconfig.types.json> # 生成类库类型声明文件的配置
安装依赖
cd joywise-lib npm install
发布的类库参考
<lib/main.ts> <lib/Socket.ts>
配置
package.json
# 按需修改,以下是示例组件 { "name": "${repo-name}", "version": "0.0.1", "main": ""./dist/${repo-name}.umd.cjs", "module": "./dist/${repo-name}.js", "types": "./types/main.d.ts", # 类库的类型声明文件 "exports": { "types": "./types/main.d.ts", "import": "./dist/${repo-name}.js", "require": "./dist/${repo-name}.umd.cjs" } }
配置
vite.config.ts
defineConfig({ lib: { name: `${repo-name}` # 类库打包的名字,一般与 package.json 中的 name 字段一致 }, rollupOptions: { external: [] # 如果类库需要去除某些依赖,需要进行配置,例如 ["lodash", "vue"] } })
单元测试
# 单元测试的文件参考 <test/main.spec.ts> # 类库打包上线前,进行本地的单元测试 npm run test # 脚手架工程中的单元测试的配置文件 <jest.config.json> # 若需要重新生成该配置文件 npx ts-jest config:int # 该命令会生成一个配置文件 module.exports = { preset: "ts-jest", testEnvironment: "node", } # 由于脚手架中 <"type": "module"> 使用 ESM 模块开发,将以上配置文件修改为 json 文件即可 { "preset": "ts-jest", "testEnvironment": "node" }
生成类型声明文件
npm run build:type # <types> 目录下会生成对应的类型声明文件
编译项目
npm run build:only # 生成类型与构建项目一起,可以运行 npm run build
发布流程(官方)
# 以下是将组件发布到官方库的流程,私有库需要相应变更 # 获取远端仓库地址 npm config get registry # 预期输出 https://registry.npmjs.org # 如果不是该地址需要配置 npm config set registry https://registry.npmjs.org # 登陆 npm login # 发布组件 npm publish # 发布成功可在npm官网搜索该组件 # 后续可以使用私有npm,将类库发布至组织结构下
更新流程
# 更新对应 package.json 的版本号 # 运行命令 npm publish
类库安装
npm install ${lib-name} <joywise-lib>
类库导入与使用
import Socket from 'joywise-lib'
let url = "ws://192.168.1.101:8888/websocket"
let ws = new Socket(url)
ws.websocketOnOpen(res=>{
console.log("建立连接成功",res)
ws.send(JSON.stringify({id:'123456',type:"login"}))
//...
})
ws.websocketOnMessage(res=>{
console.log("接收到的消息",res)
//...
})
//...
ws.removeSocket()