环境篇
1、安装Node.js
官网下载:https://nodejs.org/en/ (选择LTS那个)
下载完后,傻瓜式安装(一直下一步)
配置环境变量,在path中写入安装地址(我的安装路径是C:\Program Files\nodejs\),安装后默认配置好了
配置npm在安装全局模块时的路径和缓存cache的路径
因为在执行例如npm install webpack -g等命令全局安装的时候,默认会将模块安装在C:\Users\用户名\AppData\Roaming路径下的npm和npm_cache如下图所示
所以这里配置自定义的全局模块安装目录,在node.js安装目录下新建两个文件夹 node_global和node_cache,然后在cmd命令下执行如下两个命令:
npm config set prefix "C:\Program Files\nodejs\node_global"
npm config set cache "C:\Program Files\nodejs\node_cache"
执行成功。然后在环境变量 -> 系统变量中新建一个变量名为 “NODE_PATH”, 值为“C:\Program Files\nodejs\node_modules”,如下图:
最后编辑用户变量里的Path,将相应npm的路径改为:D:\Program Files\nodejs\node_global,如下:
更改前:
更改后
配置完成
测试下:
在cmd命令下执行 npm install webpack -g 然后安装成功后可以看到自定义的两个文件夹已生效:
2、配置淘宝镜像
在nodejs目录下执行命令
npm install -g cnpm --registry=https:
//registry.npm.taobao.org
配置失败报错时,
1、删除用户目录下的该文件,如图
2、执行清理命令:npm cache clean --force
重新执行
配置taobao仓库:npm config set registry https:
//registry.npm.taobao.org
pm config list //查看基本配置
npm config list -l //查看所有配置
npm本地安装与全局安装有什么区别?
npm install grunt // 本地安装,则是将模块下载到当前命令行所在目录。
npm install -g grunt//全局安装,模块将被下载安装到【全局目录】中;
npm如何获取全局安装的默认目录?
npm config get prefix
npm如何设置全局安装的默认目录?
npm config set prefix “directory”
3、使用 vue-cli + element-ui 快速搭建项目
① 使用 git 命令git clone https://github.com/ElementUI/element-starter.git
下载官方提供的模板
(本地电脑没有安装 git 的可以进入 https://github.com/ElementUI/element-starter ,点击绿色的 Clone or download 按钮,点击 Download ZIP 下载模板)
② 在项目根目录下使用cnpm intsall
下载依赖的模块(没有淘宝镜像 cnpm 可以使用npm install
)
③ 在项目根目录下使用npm run dev
跑项目
pm config list //查看基本配置
npm config list -l //查看所有配置
npm本地安装与全局安装有什么区别?
npm install grunt // 本地安装,则是将模块下载到当前命令行所在目录。
npm install -g grunt//全局安装,模块将被下载安装到【全局目录】中;
npm如何获取全局安装的默认目录?
npm config get prefix
npm如何设置全局安装的默认目录?
npm config set prefix “directory”