TypeScript编写共享库并发布到npm

一、初始化项目

1、新增一个文件夹，然后cmd进入到文件夹。

2、运行以下命令：

npm init

根据提示，填写相关的信息。完成以后会生成package.json，如下所示：

{
  "name": "frontlib",
  "version": "1.0.0",
  "description": "",
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "build": "tsc"
  },
  "keywords": [
    "typescript"
  ],
  "author": "lweiyue",
  "license": "ISC",
  "devDependencies": {
    "typescript": "^3.6.4"
  }
}

二、配置编译环境

TypeScript需要编译成JavaScript，才能在实际的项目中使用。

1、运行以下命令行：

npm i typescript -D

2、新建一个名为tsconfig.json的文件，内容如下：

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

三、开始编码

1、在根目录下新建一个名为lib或src的文件夹，专门存放源码。

2、在lib或src文件夹里新建一些TypeScript文件，编写功能。例如我们新建一个四则运算类，如下所示：

export class Calculator {
    public static Add(num1: number, num2: number): number {
        return num1 + num2;
    }
}

3、新建一个名为index.ts的文件，把所有的类汇总起来。如：

export { Calculator } from './Calculator';

四、编译代码

运行以下命令：

npm run build

完成以后，将会看到dist文件夹下生成了一些文件。

五、发布到npm

1、排除源码文件夹，新增一个名为.npmignore的文件，如源码文件夹为lib，则在忽略文件里增加

/lib

2、登录npm，并发布。

npm adduser
#根据提示输入信息

npm publish

如果没有npm账户，需要先到官网注册：https://www.npmjs.com/

六、使用自己编写的包

就跟使用其他包一样，npm install 包名