npm安装学习记录

npm创建项目

初入公司，前端技术使用react，查询发现使用react创建应用需要node+npm
下面开始安装配置
流程步骤是学习下面网址上内容一步步走的，为避免忘记，记录一下

https://www.cnblogs.com/lgx5/p/10732016.html

NPM安装

1：下载node.js

我这边下载的是64位的msi版本
安装路径 D:\ariel_dl\nodejs

//验证安装
node -v   
npm -v

2：npm仓库

node自带npm
路径：C:\Users\当前用户名\AppData\Roaming\npm
修改本地仓库路径
D:\ariel_dl\nodejs 下创建node_global,node_cache文件夹
运行以下2条命令

npm config set prefix "D:\ariel_dl\nodejs\node_global"
npm config set cache "D:\ariel_dl\nodejs\node_cache"

验证修改

 npm list -global

出现修改后目录表示ok

3：配置镜像站，提升速度

npm config set registry=http://registry.npm.taobao.org

4：查看配置信息

npm config list //查看所有配置信息

C:\Users\DELL\.npmrc //查看配置文件

5：检查一下镜像站

1：npm config get registry
2：npm info vue //看看能否获得vue的信息

6：将设置配在global目录下

npm install npm -g

npm install 安装或更新命令
npm 模块名称
-g 安装至global所在目录
此命令执行需要几秒钟
安装完毕后执行 npm -v 可以看出npm模块升级
再次查看全局目录

npm list -global

可以发现目录不为空 D:\ariel_dl\nodejs\node_global 下面有内容

8：设置环境变量

前面的步骤走完后 我们的默认模块更改
原默认模块D:\ariel_dl\nodejs\node_modules
会改变为D:\ariel_dl\nodejs\node_global\node_modules
这时将不能直接运行npm install等命令，否则会报错。
接下来我们只需要配置NODE_HOME的环境变量
路径为D:\ariel_dl\nodejs\node_global\node_modules就OK了

NPM测试

注意，以下操作需要重新打开CMD让上面的环境变量生效

1：安装vue.js

npm install vue -g

安装完毕 查看
D:\ariel_dl\nodejs\node_global\node_modules\vue

2：安装vue-router

npm install vue-router -g

安装完毕 查看
D:\ariel_dl\nodejs\node_global\node_modules\vue-router

3：安装Vue脚手架

npm install vue-cli -g

4：配置环境变量

此时vue还不能使用
因为Vue脚本没有在path变量中，在自定义全局目录下
编辑path,添加D:\ariel_dl\nodejs\node_global
重新打开cmd,vue -V V大写

初始化项目

1：创建一个项目

vue init webpack myproject

vue init 模板类型 项目名称；
模板类型有很多种(用vue list查看)

2：安装依赖

cd vue01 //进入目录
npm install //开始安装
npm run dev //运行安装依赖

运行依赖后进入成功界面
打开地址 http://localhost:8080/#/

生成静态文件 npm run build
打开dist文件夹下新生成的index.html文件,进入项目首页

OK 大功告成！