npm install(本地项目依赖,无-g)
作用
读取当前项目根目录下的 package.json 文件,自动安装文件里记录的项目所需依赖包 (包括 @vue/cli-service、vue、axios、scui 等页面运行必须的包)。
- 只给当前这个文件夹里的项目使用;
- 你之前报错
vue-cli-service 不是内部命令,就是没执行这条命令,项目本地缺少工具包。
安装路径
当前项目文件夹内:
你的项目文件夹/node_modules/
配套文件:package-lock.json(记录版本锁定)
特点
- 不写入系统环境变量,只能在本项目通过 npm 脚本调用;
- 删除项目文件夹,依赖直接消失;
- 多项目可安装不同版本,互不冲突。
2. npm install -g @vue/cli(全局安装,带 -g global)
-g = global 全局
作用
全局安装 Vue 官方脚手架工具 @vue/cli,提供系统级命令:vue create、vue ui 等,用来新建 Vue 项目。
注意:这条命令和你本地运行
npm run serve没有强制关系!npm run serve靠本地项目内 的@vue/cli-service,不靠全局 vue。
全局安装路径(分系统)
Windows(默认 npm 路径)
-
npm 全局包目录:
C:\Users\你的用户名\AppData\Roaming\npm\node_modules\
-
全局可执行命令(vue.cmd):
C:\Users\你的用户名\AppData\Roaming\npm\
这个目录会自动加到系统 PATH,所以任意终端输入 vue -V 能识别。
Mac / Linux
~/.npm-global/lib/node_modules/
~/.npm-global/bin/
查看本机真实全局路径命令
终端执行:
npm config get prefix
会直接输出你电脑全局 npm 安装根目录。
特点
- 全电脑所有项目共用一套版本;
- 任意文件夹终端都能执行
vue命令; - 重装系统 / 删除 npm 全局目录才会消失。
二、核心区别对比表
表格
| 命令 | 安装范围 | 存放位置 | 用途 | 对你当前 SCUI 项目是否必需 |
|---|---|---|---|---|
npm install |
当前项目本地 | 项目 /node_modules | 运行 serve、页面开发 | ✅ 必须,不装启动直接报错 |
npm install -g @vue/cli |
整台电脑全局 | npm 全局目录 | 创建新项目 vue create |
❌ 非必需,不装也能运行现有项目 |
三、补充你之前报错的关键误区
你一开始报错 'vue-cli-service' 不是内部或外部命令 很多人误以为装全局 @vue/cli 就能解决,其实不对:
-
vue-cli-service是本地依赖,必须执行npm install安装到项目node_modules; -
全局
@vue/cli只管vue命令,不管项目启动脚本; -
正确修复顺序:
1. 先装项目依赖(核心)
npm install
2. 可选:全局脚手架(仅新建项目用)
npm install -g @vue/cli
3. 启动
npm run serve
四、额外常用查看命令
-
查看全局安装了哪些包
npm list -g
-
查看当前项目本地安装包
npm list
-
修改 npm 全局安装路径(不想放 C 盘可自定义)
npm config set prefix "D:\node\npm_global"