从0到1使用TS实现一个node.js脚手架工具

1.新建一个项目文件夹,然后初始化一下项目文件

bash 复制代码
npm init -y

2.创建一个src文件夹,里面放index.ts

TypeScript 复制代码
#!/usr/bin/env node

import prompts from "prompts";
import path from "node:path";
import fs from "node:fs";
const bootstrap = async () => {
    const result =  await prompts([
        {
            type: "text",
            name: "projectName",
            message: "请输入项目名称:"
        },
    ]);
    const targetPath = path.resolve(process.cwd(), result.projectName);
    const sourcePath = path.resolve(__dirname, "../template");
    console.log(targetPath);
    fs.cpSync(sourcePath, targetPath,{
        recursive: true,
    });
    fs.renameSync(
        path.resolve(targetPath, "_gitignore"),
        path.resolve(targetPath, ".gitignore")
    );
    console.log(`
    项目创建成功!!
    cd ${result.projectName}
    npm install
    npm run dev
    `)
};
bootstrap();

3.需要安装的依赖

bash 复制代码
npm i -D typescript tsup prompts @types/prompts

4.配置ts文件

根目录下创建tsconfig.json

TypeScript 复制代码
{
    "include": ["src"],
    "compilerOptions": {
        "target": "ES2022",
        "module": "ES2022",
        "moduleResolution": "Bundler",
        "outDir": "dist",
        "skipLibCheck": true,
        "declaration": false,
        "strict": true,
        "rootDir": "src"
    }
}

5.配置tsup

根目录下创建tsup.config.ts

TypeScript 复制代码
import { defineConfig } from 'tsup'

export default defineConfig({
    target:"node18",
    entry:["src/index.ts"],
    clean: true,
    format:["cjs"],
    minify: true,
    platform: "node",
    outDir: "dist",
})

6.配置package.json文件

名字起create-xxx

TypeScript 复制代码
{
  "name": "create-cocobin",
  "version": "1.0.0",
  "description": "",
  "bin": {
    "create-cocobin": "dist/index.js"
  },
  "file": [
    "dist",
    "template"
  ],
  "scripts": {
    "dev": "tsup --watch",
    "build": "tsup",
    "typecheck": "tsc --noEmit",
    "release": "release-it"
  },
  "keywords": [],
  "author": "",
  "license": "MIT",
  "devDependencies": {
    "@types/prompts": "^2.4.9",
    "prompts": "^2.4.2",
    "release-it": "^17.2.1",
    "tsup": "^8.0.2",
    "typescript": "^5.4.5"
  },
  "release-it": {
    "hooks": {
      "after:bump": "npm run build"
    }
  }
}

7.创建template文件夹,里面放入要传入的项目

里面把.gitignore文件改成_gitignore --> 避免影响文件

不要node_module文件夹

不要pnpm-lock.yaml文件

8.下载发布工具

bash 复制代码
npm init release-it

9.添加.gitignore

TypeScript 复制代码
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*

node_modules
dist
dist-ssr
*.local

# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

10.发布到npm

bash 复制代码
npm run dev
bash 复制代码
git init
bash 复制代码
npm config set registry https://registry.npmjs.org/
bash 复制代码
npm login 

提交到github

bash 复制代码
npm run release
相关推荐
轻口味1 小时前
【每日学点鸿蒙知识】AVCodec、SmartPerf工具、web组件加载、监听键盘的显示隐藏、Asset Store Kit
前端·华为·harmonyos
alikami1 小时前
【若依】用 post 请求传 json 格式的数据下载文件
前端·javascript·json
wakangda2 小时前
React Native 集成原生Android功能
javascript·react native·react.js
吃杠碰小鸡2 小时前
lodash常用函数
前端·javascript
丰云2 小时前
一个简单封装的的nodejs缓存对象
缓存·node.js
emoji1111112 小时前
前端对页面数据进行缓存
开发语言·前端·javascript
泰伦闲鱼2 小时前
nestjs:GET REQUEST 缓存问题
服务器·前端·缓存·node.js·nestjs
m0_748250032 小时前
Web 第一次作业 初探html 使用VSCode工具开发
前端·html
一个处女座的程序猿O(∩_∩)O2 小时前
vue3 如何使用 mounted
前端·javascript·vue.js
m0_748235952 小时前
web复习(三)
前端