JS项目必备:5个关键npm脚本提升开发效率
身为JavaScript开发者,你的工作流程中想必少不了这些手动操作:代码格式化、清理构建目录、提交前手动跑测试……然而你的package.json能做的远不止npm start。把这些琐碎任务脚本化,一次配置就能长期受益。

说实话,写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条脚本帮我省时、避坑、切换项目不掉线。今天配一次,未来的你每天都会默默说谢谢。
相关攻略
本文分享五个在实际开发中能立即上手、且能显著提升代码质量的 JavaScript 现代编码技巧。 在前端圈子,写出能跑通的代码不难,但写出“高性能”的代码却是一道分水岭。随着 Web 应用变得越来越
从 px 到 rem 再到 clamp() 的演进,不仅是 CSS 单位的更迭,更是前端开发理念的进化——从固定的像素点,到响应式的断点,再到如今的万物皆流体。 从px的绝对统治,到rem成为响应式
写 JavaScript 的你,工作流里十有八九还藏着一两步手工体力活:手动格式化、手动清理构建目录、提交前手动跑测试…… 可你的 package json 远不止会 npm start。把
热门专题
热门推荐
公安部就电子数据取证规则公开征求意见,拟将网络安全等行政案件纳入适用范围,并规范取证流程与核心概念。新规特别明确了获取密码、调取通讯内容等特殊程序,需经严格审批并保障当事人权利。配套法律文书也同步优化,以构建更规范且注重权利保障的取证体系。
理想L9和LIvis的定价策略刚掀起波澜,小鹏GX的最终价格就给出了更猛烈的回应——从近40万元的预售价直降至27万元起。用小鹏产品矩阵负责人吴安飞的话说,这叫“9系的产品,8系的价格”。 这12万元的下调,效果堪称立竿见影。发布会次日,小鹏集团港股股价一度大涨超8%。更关键的是市场订单:上市12小
5月21日,环塔拉力赛新疆且末赛段大营迎来了一位备受瞩目的访客——知名零售企业胖东来的创始人于东来。他专程前往长城汽车车队营地,与参赛车手及后勤团队进行了深度交流。据悉,于东来此次自驾越野之旅已历时一月,随行车队中包含多款国产越野车型。经过实地驾驶与多维度对比,他对以长城汽车为代表的国产越野车品质给
比特币官方入口在哪里?一个核心门户的权威指南 说起比特币,很多人第一反应是去找它的“官网”或“官方App”。但这里有个关键点需要先理清:比特币本质上是一种去中心化的全球数字货币,它不属于任何一家公司或机构,而是由一个庞大的、遍布全球的社区共同维护。因此,它并没有传统意义上由某个企业运营的“官方网站”
Ring-2 5-1T是什么 在当今大模型技术激烈竞争的赛道上,追求更长的上下文处理能力和更强大的深度推理性能已成为核心焦点。近日,蚂蚁集团旗下的inclusionAI团队重磅开源了Ring-2 5-1T模型,这是一个参数规模高达万亿级别的混合线性思考大语言模型。该模型基于先进的Ling 2 5架构





