我有一支技术全面、经验丰富的小型团队，专注高效交付中等规模外包项目，有需要外包项目的可以联系我

说实话，写 JavaScript 的你，工作流里十有八九还藏着一两步手工体力活：手动格式化、手动清理构建目录、提交前手动跑测试…… 可你的 package.json 远不止会 npm start。把琐事脚本化，一次配置，日日省心。

下面这 5 条 npm 脚本，我在所有 JS 项目里都放：从小工具到正儿八经的大前端应用，一套走天下。

1) npm run dev —— 本地开发的“续命管”

一键拉起本地服务，自动监听改动，热更新不求人。

"scripts": {
  "dev": "vite"
}

如果是 Next.js：

"scripts": {
  "dev": "next dev"
}

为什么重要：热重载 + 即时反馈 + 本地联调，一条命令全打包。

2) npm run lint —— 把坑堵在“上线前一天”之前

Lint 不只是“风格统一”，它还能提前抓住未使用变量、危险比较、潜在 Bug。

"scripts": {
  "lint": "eslint . --ext .js,.jsx,.ts,.tsx"
}

为什么重要：少掉大半调试时间；同事和未来的你都会感谢现在的你。

3) npm run format —— 统一风格，评论区从此安静

别再为逗号还是缩进吵半天，用 Prettier 直接把格式之争变成自动修复。

"scripts": {
  "format": "prettier --write ."
}

为什么重要：一次运行、全仓库自动美化；评审讨论专注逻辑与设计。

4) npm run build —— 上线之前，先“瘦身+打包+优化”

真正的部署前一步：产出可上线的产物。

Next.js：

"scripts": {
  "build": "next build"
}

Vite / Webpack 项目：

"scripts": {
  "build": "vite build"
}

为什么重要：最小化、摇树优化、资源切分，上线前的三重加速一次到位。

5) npm run clean —— 该清就清，别让旧产物吓你

构建残留、缓存堆积、状态脏了——重来一遍更踏实。

"scripts": {
  "clean": "rm -rf dist .next"
}

跨平台建议用 rimraf（兼容 Windows）：

"scripts": {
  "clean": "rimraf dist .next"
}

为什么重要：干净的构建 = 更少的灵异 Bug + 更顺的 CI。

一键编排多任务

想把多步串起来？上 npm-run-all：

npm install npm-run-all --save-dev

然后：

"scripts": {
  "prepare": "npm-run-all clean lint format build"
}

效果：一条命令串起清理 → 检查 → 美化 → 构建，手起刀落。

---

📦 贴就能用的脚本清单

复制到任意 package.json，再按你的框架小改即可：

"scripts": {
  "dev": "vite",
  "lint": "eslint . --ext .js,.jsx,.ts,.tsx",
  "format": "prettier --write .",
  "build": "vite build",
  "clean": "rimraf dist"
}

---

💡 最后的话

好开发者不只会写代码，还擅长把重复动作脚本化。 这 5 条脚本帮我省时、避坑、切换项目不掉线。今天配一次，未来的你每天都在默默说谢谢。

想要一个开箱即用的公共模板？留言告诉我——我就把它开源出来。 Happy hacking 🛠️

全栈AI·探索：涵盖动效、React Hooks、Vue 技巧、LLM 应用、Python 脚本等专栏，案例驱动实战学习，点击二维码了解更多详情。

最后：

Vue 设计模式实战指南 

20个前端开发者必备的响应式布局

深入React:从基础到最佳实践完整攻略

python 技巧精讲

React Hook 深入浅出

CSS技巧与案例详解

vue2与vue3技巧合集