TypeScript编写共享库并发布到npm

mac2024-03-06  38

一、初始化项目

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 包名

最新回复(0)