使用Typescript编写和发布npm包

1. 初始化 Git 环境

在GitHub上创建一个仓库，克隆到本地

git clone https://github.com/lismill/webpack-upload-assets-plugin.git

2. 初始化 NPM 包

根据提示，填写相应信息。生成package.json

npm init

3. 安装Typescript

npm i typescript -D

4. 配置tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "declaration": true,
    "outDir": "./dist",
    "strict": true
  }
}

5. 编译

添加编译命令到 package.json 文件中

{
  "name": "webpack-upload-assets-plugin",
  "version": "1.0.0",
  "description": "webpack-upload-assets-plugin",
  "main": "index.js",
  "scripts": {
    "build": "tsc"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/lismill/webpack-upload-assets-plugin.git"
  },
  "keywords": [
    "webpack",
    "upload",
    "assets",
    "server",
    "plugin"
  ],
  "author": "lismill",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/lismill/webpack-upload-assets-plugin/issues"
  },
  "homepage": "https://github.com/lismill/webpack-upload-assets-plugin#readme",
  "devDependencies": {
    "typescript": "^4.3.5"
  }
}

6. 发布

npm adduser

npm publish

7. 添加 CI（持续集成）

1）登录 Travis CI

2）点击 “Sign in with Github”

3）勾选需要持续集成的项目

4）添加 travis 的配置文件

language : node_js
node_js :
 - stable
install:
 - npm install
script:
 - npm run build

5. 代码推送到远端，查看构建状态

6）获取徽章图

7）将徽章添加到 README 中

8）提交，推送到 GitHub 仓库

NPM — 2021年7月17日