ESMate：JavaScript/TypeScript 开发的抗疲劳工具箱

Source: Dev.to

启动一个新的 JavaScript 或 TypeScript 项目常常感觉像是在与配置作斗争。在写下第一行业务代码之前，你通常要先搞定 ESLint、Prettier、TypeScript、Tailwind CSS 以及测试工具的配置。这是一场重复且耗费精力的仪式。

ESMate 回答了一个简单的问题：“我们如何让现代 JavaScript 开发变得顺畅且轻松，即使在 Node.js 世界里？” 受 Deno 开发者体验的启发，ESMate 提供了一整套工具和包，旨在简化现代 Web 开发工作流。它不是新的运行时，而是一个帮助层，让在 Node.js 生态系统中的生活更加愉快。

核心工具

1. esmate (CLI)

esmate CLI 是工具箱的核心。它将常见任务统一到一个连贯的界面中。

• Lint & Format – 用零配置默认值包装 ESLint 和 Prettier。

  esmate lint   # 检查代码
  esmate fmt    # 自动修复格式

• Task Runner – 一个强大的任务运行器，兼容 npm 脚本但功能更强。支持在 package.json 中直接定义的顺序执行和并行执行。

  npm install -D esmate

2. create-esmate

忘掉复制粘贴旧的配置文件吧。create-esmate 是一个脚手架工具，能够瞬间搭建现代化应用。它开箱即支持 React、Vue、Solid、Svelte、Astro 和 Next.js。

npm create esmate@latest

你还可以从以下强大的模板中选择：

• react-spa – React + TanStack Router
• react-astro – React + Astro + TanStack
• react-next – React + Next.js + Drizzle + Stripe

包集合

@esmate/utils

一个全面的工具带，重新导出并统一了：

• es-toolkit – 现代、高性能的 Lodash 替代品。
• math.js – 用于复杂数学运算。
• String tools – 高级字符串处理（标题大小写、错别字修正）。

@esmate/react

让 React 开发更轻松。

• Hooks – 包含 ahooks 的全部强大功能（useRequest、usePagination）。
• Custom Hooks – 专用 Hook，如 useImmutableState（基于 Immer）和 useSearchParams。

@esmate/shadcn

如果你使用 shadcn/ui，你会爱上它。它将 shadcn 组件、Hook 和样式打包成一个可安装的包。

• Zero Config – 自动与 Tailwind 配合使用。
• Pre‑built UI – 直接导入组件，例如 import { Button } from "@esmate/shadcn/components/ui/button"。
• Bundled Deps – 无需手动安装 zod、react-hook-form 或 radix-ui 基础库——它们都已重新导出。

@esmate/eslint & @esmate/prettier

有主张但可配置的 “为人类设计” 设置。

• @esmate/eslint – 基于 @antfu/eslint-config 的包装，针对 React、Vue、Astro 和 Svelte 进行调优。
• @esmate/prettier – 包含 Tailwind CSS 插件和合理的默认配置。

为什么要切换？

我们相信开发者应该把时间花在 构建 上，而不是配置上。ESMate 让你跳过繁琐的模板仪式，直接投入到真正重要的工作中。

今天就试试看吧：