npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

@playdayy/create-toolchain

v1.0.0

Published

前后端通用工程化项目模板生成器:一键生成 ESLint/Prettier/Husky/commitlint/GitLab CI 等规范配置,并自动安装依赖

Readme

create-toolchain(工程化工具链搭建工具)

一个 npm CLI 工具:为项目生成/补齐完整工具链配置(EditorConfig / Prettier / ESLint / Husky / commitlint / VSCode 配置 / GitLab CI),并自动安装依赖。支持两种场景:

  • 新建项目create-toolchain my-app 生成纯工具链
  • 已有项目create-toolchain(当前目录)自动适配框架(Vue / React / 通用)补齐工具链

本工具只创建工具链,不涉及框架搭建:不生成任何框架源码,业务代码由团队自行组织;框架适配仅体现在 ESLint 配置与依赖上。

快速开始

方式一:npx(无需安装)

# 新建项目工具链
npx @playdayy/create-toolchain my-app

# 在已有项目(当前目录)上搭建工具链
npx @playdayy/create-toolchain

方式二:npm create

npm create @playdayy/toolchain my-app

方式三:本地安装后使用

npm install -g @playdayy/create-toolchain
create-toolchain my-app
create-toolchain            # 已有项目模式(当前目录有 package.json 时自动进入)

已有项目模式(自动适配框架)

在项目根目录直接执行 create-toolchain(或 create-toolchain --existing / create-toolchain .),工具自动完成:

  1. 自动检测框架:读取 package.json 依赖判断 Vue / React / 通用(Node 服务等其他技术栈归入通用)
  2. 自动选择 ESLint 配置
    • Vue → @antfu/eslint-config(vue 规则)
    • React → eslint-plugin-react / react-hooks / react-refresh
    • 通用 → 基础 TS/JS 配置(含 Node 服务等无专属 ESLint 插件的项目)
  3. 自动判断:TypeScript(有 tsconfig/依赖;有框架时默认 TS)、包管理器(按 lockfile 判断 pnpm/npm/yarn)
  4. 生成缺失的配置文件.editorconfig.prettierrccommitlint.config.js.husky/*.vscode/*.env.example.gitlab-ci.ymleslint.config.js
  5. 合并 package.json:补充 lint/format/prepare scripts、lint-staged、工具链 devDependencies(不覆盖已有依赖与脚本)
  6. 自动 git init(如无 .git)并安装依赖

安全策略:已存在的配置文件默认跳过(不覆盖你的现有配置),使用 --force 才覆盖。

create-toolchain                    # 自动适配 + 默认跳过已有文件
create-toolchain --force            # 覆盖已存在的配置文件
create-toolchain --no-install       # 只写配置,不装依赖

命令行参数

create-toolchain <项目名> [选项]      # 新建项目
create-toolchain [选项]              # 已有项目模式(当前目录有 package.json 时自动进入)

选项:
  --existing        在已有项目(当前目录)上搭建工具链
  --force           覆盖已存在的配置文件(默认跳过)
  --pnpm|--npm|--yarn   指定包管理器(默认:已有项目按 lockfile 判断,新建询问)
  --ts | --no-ts    是否使用 TypeScript(默认自动判断)
  --yes             跳过交互,全部使用默认值
  --no-install      不自动安装依赖
  -h, --help        显示帮助

生成的内容(工具链)

| 文件 | 作用 | |------|------| | .editorconfig | 编辑器基础格式(2 空格 / LF / UTF-8) | | .prettierrc / .prettierignore | 代码格式化规则 | | eslint.config.js | 按框架适配的 ESLint 配置(Vue/React/通用 × TS/JS) | | commitlint.config.js | Commit Message 规范(type-enum、header ≤100) | | .husky/pre-commit | commit 前对暂存文件执行 ESLint + Prettier(lint-staged) | | .husky/commit-msg | commit 时校验提交消息格式 | | .vscode/settings.json | 团队 VSCode 配置(保存时 ESLint 自动修复;格式化由提交钩子 lint-staged 统一执行) | | .vscode/extensions.json | 推荐插件(成员打开项目时自动提示安装) | | .gitlab-ci.yml | CI:eslint → prettier → type-check → test → build | | .env.example | 环境变量模板(复制为 .env 使用,密钥不入库) | | package.json | 工具链 scripts(lint / format / prepare)+ 工具链 devDependencies + lint-staged |

新建项目模式额外生成 .gitignore 与初始 README.md;已有项目模式不触碰你的 .gitignore / README.md / tsconfig.json / 已有配置。

发布到 npm

本仓库本身就是一个 npm 包(package.json 已配置 bin)。发布:

# 发布到 GitLab Package Registry(私有,推荐)
npm config set //registry.npmjs.org/:_authToken=npm_xxxxxxx
npm publish

# 或发布到公共 npm(需先去掉 package.json 中的 "private": true)
npm publish --access public

其他说明

  • Prettier 负责格式,ESLint 负责质量eslint-config-prettier 始终放 ESLint 配置最后一项。
  • 提交前自动检查:依赖安装后 Husky 即生效,commit 时会自动 lint 暂存文件并校验提交消息。
  • 已有项目 prepare 脚本冲突:若项目已有 prepare 脚本(非 husky),工具不会覆盖,需手动执行 npx husky init 使提交钩子生效。
  • CI 分支保护:GitLab → Settings → Merge requests → 开启 Pipelines must succeed、要求 1 个 approval。

维护

  • 修改内置模板:templates/base/(通用工具链)、templates/js/(JS 版 ESLint)、templates/vue|react/(框架版 ESLint 配置)。<PROJECT_NAME> 为占位符,生成时自动替换。
  • 修改生成逻辑:bin/index.js(入口与模式)、lib/generate.js(模板组装与 package.json 合并)、lib/detect.js(框架/包管理器/TS 自动判断)、lib/install.js(git init / 安装依赖)、lib/prompts.js(交互提问)。
  • 新增框架适配:在 templates/ 新增目录与 FRAMEWORK_EXTRA_DEPS 登记,并在 lib/detect.js 增加检测条件。
  • 团队 ESLint 规则如持续积累,可抽成共享 preset(发布到 GitLab Package Registry),模板中只 extends