npm管理依赖需分用途选命令:运行时库用npm install写入dependencies,开发库加-d写入devdependencies,工具类用-g全局安装;卸载必须用npm uninstall并匹配参数,否则导致依赖不一致。

npm 是前端项目依赖管理的核心工具,用它安装和卸载第三方库,关键在于分清用途、选对命令、管好 package.json。
安装第三方库:按用途选参数
安装不是“一装了事”,要根据库的实际作用决定写入哪个字段:
-
运行时必需的库(如
axios、lodash、react-router):直接运行npm install axios,自动写入dependencies -
仅开发阶段需要的库(如
eslint、vite、@types/react):加-D参数,例如npm install eslint -D,写入devDependencies -
命令行工具类包(如
http-server、typescript):用-g全局安装,例如npm install http-server -g;注意这类包不能在项目代码中import或require
卸载第三方库:自动同步 package.json
卸载必须用 npm uninstall,不能手动删 node_modules 或改 package.json,否则会不一致:
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
- 卸载运行时依赖:
npm uninstall axios→ 从node_modules删除,并从dependencies移除 - 卸载开发依赖:
npm uninstall eslint -D→ 从devDependencies移除(-D必须带上,否则误删进dependencies) - 卸载全局包:
npm uninstall http-server -g
验证与清理:确保环境干净可靠
装完或卸完别急着写代码,快速确认是否生效:
- 查看当前项目一级依赖(不含嵌套):
npm list --depth=0 - 检查哪些库有新版本可升:
npm outdated(避免盲目升级) - 彻底重装所有依赖(比如拉新代码后):
rm -rf node_modules package-lock.json && npm install(Mac/Linux);Windows 可用rd /s /q node_modules && del package-lock.json && npm install
几个容易踩的坑
实际操作中高频出错点:
-
npm install xxx没加-D却想当开发依赖用 → 后续打包可能把eslint打进去,增大体积 - 用
npm uninstall xxx -D卸载本在dependencies的包 → 不会删掉,反而报错“not found in devDependencies” - 误删
package-lock.json后只运行npm install→ 版本可能漂移,CI 构建结果不一致;该文件必须提交到 Git - 全局安装的包(如
create-react-app)已过时 → 建议改用npx create-react-app@latest,避免全局污染
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










