要使用TypeScript和Rollup打造一个npm工具库,你需要执行以下步骤:
- 初始化项目并安装TypeScript和Rollup依赖。
- 创建TypeScript配置文件
tsconfig.json
。 - 创建Rollup配置文件。
- 编写你的库代码。
- 构建库并发布到npm。
以下是一个简单的例子:
- 初始化项目并安装依赖:
npm init -y
npm install --save-dev typescript rollup @rollup/plugin-typescript rollup-plugin-terser
- 创建
tsconfig.json
:
{
"compilerOptions": {
"target": "es5",
"module": "es2015",
"strict": true,
"noImplicitReturns": true,
"moduleResolution": "node",
"esModuleInterop": true,
"declaration": true,
"outDir": "dist",
"sourceMap": true
}
}
- 创建
rollup.config.js
:
import typescript from '@rollup/plugin-typescript';
import { terser } from 'rollup-plugin-terser';
export default {
input: 'src/index.ts',
output: [
{
file: 'dist/my-library.cjs.js',
format: 'cjs',
},
{
file: 'dist/my-library.esm.js',
format: 'esm',
},
{
file: 'dist/my-library.umd.js',
format: 'umd',
name: 'myLibrary'
}
],
plugins: [
typescript({ tsconfig: './tsconfig.json' }),
terser()
]
};
- 在
src
目录下创建index.ts
文件并编写你的库代码。 - 在项目根目录下创建一个构建脚本,例如
build.js
:
const { build } = require('rollup');
const rollupConfig = require('./rollup.config');
build(rollupConfig)
.then(() => {
console.log('Build successful');
})
.catch(error => {
console.error('Build error:', error);
process.exit(1);
});
- 在
package.json
中添加scripts:
{
"scripts": {
"build": "node build.js"
}
}
- 构建库:
npm run build
发布到npm:
首先确保你已在npm上注册账号,然后登录到你的npm账号:
npm login
然后发布:
npm publish
这个例子提供了一个基本框架,你可以根据自己的需求进行扩展和定制。