it 技术

Typescript 构建并发布 npm 包

typescript 项目怎样编译打包发布到 npm, 并且能够让其他项目通过 javascript 和 typescript 使用。

为此写了两个测试项目：

实现 MarshalW/fake-ts-service 需要注意的点：

  • tsconfig.json

    • 可通过命令生成 tsc --init
    • "compilerOptions" 属性下：
      • "module": "ESNext"，默认是commonjs
      • "declaration": true,，默认是屏蔽的
      • "declarationMap": true,, 默认是屏蔽的
      • "moduleResolution": "node", 否则 tsc 编译会无法解析包
      • "outDir": "./lib"，设置构建输出路径
    • "include": ["src"]
    • "exclude": ["node_modules", "**/__tests__/*"]

  • package.json

    • "main": "lib/index.js",
    • "types": "lib/index.d.ts",，为了 typescript 应用引用这个包时的类型定义
    • "files": [ ..，设置打包文件的白名单，这样不会再输出 src

  • 执行：

    • npm run build，编译生成 javascript，在 lib 目录下
    • npm test，执行测试，验证本地导入和执行模块
    • npm version patch，在确保 git 提交后，设置小版本更新
    • npm publish，发布当前更新的 npm 包

实现 MarshalW/fake-ts-service-client 需要注意的点：

  • tsconfig.json

    • "compilerOptions"
      • "module": "ESNext",
      • "moduleResolution": "node", 否则 tsc 编译会无法解析包
      • "outDir": "./dist"

  • package.json

    • "main": "dist/index.js",
    • "type": "module",

  • 执行：

    • npm i,
    • node test.js, 测试 js 代码直接访问 fake-ts-service
    • npm run build
    • npm start, 测试 ts 代码访问 fake-ts-service