npm 安装
1、下载 nodejs
在安装完 nodejs 之后,执行 npm -v ,就已经可以执行出结果了
注1:npm 和 cnpm 的区别
npm 是 nodejs 的包管理器,用于 node 插件管理(包括安装,卸载,管理依赖等),但由于 npm 的安装插件是从国外的服务器上下载,淘宝团队使用了国内镜像来代替国外服务器
2、在 nodejs 目录下新建两个文件夹,分别为 node_cache 和 node_global
在 cmd 窗口执行:
npm config set prefix "E:\nodejs\node_global"
npm config set cache "E:\nodejs\node_cache"
命令执行前:
npm list -global
C:\Users\用户\AppData\Roaming\npm
`-- cnpm@7.1.0
命令执行后(可以看到目录已经改变了):
npm list -global
E:\nodejs\node_global
`-- (empty)
3、配置镜像站
npm config set registry=http://registry.npm.taobao.org
配置完成后:
npm config list
; "builtin" config from E:\nodejs\node_modules\npm\npmrc
; prefix = "C:\\Users\\用户\\AppData\\Roaming\\npm" ; overridden by user
; "user" config from C:\Users\用户\.npmrc
cache = "E:\\nodejs\\node_cache"
prefix = "E:\\nodejs\\node_global"
registry = "http://registry.npm.taobao.org/"
strict-ssl = false
; node bin location = E:\nodejs\node.exe
; cwd = C:\Users\用户
; HOME = C:\Users\用户
; Run `npm config ls -l` to show all defaults.
参考截图:
这里我们可以关注一个文件,即 C:\Users\用户.npmrc ,内容为:
strict-ssl=false
prefix=E:\nodejs\node_global
cache=E:\nodejs\node_cache
registry=http://registry.npm.taobao.org/
4、使用管理员权限执行
npm config get registry
npm info vue
vue@2.6.14 | MIT | deps: none | versions: 361
https://github.com/vuejs/vue#readme
dist
.tarball: https://registry.npmmirror.com/vue/download/vue-2.6.14.tgz
.shasum: e51aa5250250d569a3fbad3a8a5a687d6036e235
maintainers:
- posva <posva13@gmail.com>
- yyx990803 <yyx990803@gmail.com>
dist-tags:
beta: 3.2.0-beta.8 csp: 1.0.28-csp latest: 2.6.14 next: 3.2.22
published 5 months ago by posva <posva13@gmail.com>
npm notice
npm notice New patch version of npm available! 8.1.0 -> 8.1.3
npm notice Changelog: https://github.com/npm/cli/releases/tag/v8.1.3
npm notice Run npm install -g npm@8.1.3 to update!
npm notice
5、使用管理员权限执行
npm install npm -g
npm list -global
E:\nodejs\node_global
`-- npm@8.1.3
6、增加名为 NODE_PATH 的环境变量,E:\nodejs\node_global\node_modules
7、测试 npm 安装 vue
npm install vue -g
npm install vue-router -g
npm install vue-cli -g
参考:
此时在 E:\nodejs\node_global\node_moudles 路径下可以看到 vue 模块
此时在 cmd 中执行 vue 会报错,需要在环境变量 PATH 中加上 E:\nodejs\node_global (vue.cmd 的路径),生效需要重新打开命令行
vue -V 可以查看 vue 的版本
参考文档:
本地使用命令行搭建一个 vue 工程
新建一个 vue 工程
E:\>vue init webpack vue01
报错: vue-cli · Failed to download repo vuejs-templates/webpack: unable to get local issuer certificate
修改 E:\nodejs\node_global\node_modules\vue-cli\node_modules\download 目录下的 index.js 文件,修改的时候可能会提示文件被占用,可以将文件拷贝出来,修改完之后再覆盖回去
修改内容:
注释: rejectUnauthorized: process.env.npm_config_strict_ssl !== ‘false’
然后改为: rejectUnauthorized : false
注1:Install vue-router 选择 y
注2:Use ESLint to lint your code 是否选用 ESLint 管理代码,ESLint 是个代码风格管理工具,是用来统一代码风格的
注3:如果在 init 时报错了,就在对应工程目录下重新 npm install -g vue-cli 一下。如我们想将 vue01 工程放在 E 盘的根目录下,就在 E:\ 执行命令
cd vue01
npm install
# 启动服务
npm run dev
也即到对应工程下,执行命令。执行成功后,可以根据提示访问:
http://localhost:8080
npm 相关命令
-g 全局安装,可以直接在命令行使用。在使用 npm 安装模块时,-g 可以用于安装 vue,vue-router,vue-cli 等模块,但针对一些功能性模块,一般都是选择本地安装,也即 --save-dev ,实现一个工程一个配置
查看全局安装的文件夹位置
npm root -g
E:\nodejs\node_global\node_modules
-S --save 安装包信息将加入到dependencies(生产阶段依赖)
# 安装成功后,在package.json的dependencies中就会出现eslint的相关信息
npm install eslint --save
# 卸载
npm uninstall eslint --save
# 安装成功后,在package.json的devDependencies中就会出现eslint的相关信息
-D --save-dev 安装包信息将加入到devDependencies(开发阶段依赖)
i install缩写
安装 cnpm
npm install cnpm -g