Vue node安装以及创建项目

Vue node安装

一、安装node
打开官网下载链接:https://nodejs.org/en/download/
下载完成后，双击，即开始安装Node.js 修改好自己安装的路径 其他都默认就可以
Node.js安装完成，可以先进行下简单的测试安装是否成功了，检查node安装是否成功，在git/cmd 工具中输入node -v查看
出现版本号就安装成功

二、安装npm
npm一般随node一起安装 在电脑中，node如果成功了，npm基本都会没问题
npm的作用就是对Node.js依赖的包进行管理
在cmd输npm -v检查是否安装成功

安装完目录如下：

三、环境配置（可以配置也可以不配置）
配置npm安装的全局所在的路径和缓存cache的路径 我希望他们放到一起 不占c盘内存
所以在我希望安装的路径下面建两个空文件夹
node_global和node_cache

创建完两个空文件夹之后，打开cmd命令窗口，输入
npm config set prefix “D:\Develop\nodejs\node_global”
npm config set cache “D:\Develop\nodejs\node_cache”
然后去设置环境变量
在【系统变量】下新建【NODE_PATH】，输入【D:\前端学习\nodejs\node_global\node_modules】，将【用户变量】下的【Path】修改为【D:\前端学习\nodejs\node_global】

四、
配置好以后开始安装基于node.js,利用淘宝npm镜像安装cnpm

在git工具中输入: npm install -g cnpm --registry=https://registry.npm.taobao.org 回车 等待就可以
检验是否安装成功: cnpm

五、安装yarn
参考网站: https://www jianshu.com/p/4a225dcacd53
git/cmd工具输入: npm install -g yarn
检验是否安装成功: yarn -v

六、vue安装
git/cmd工具输入: cnpm install vue

七、vue-cli3脚手架工具安装
git/cmd工具输入: cnpm install -g @vue/cli或 者yarn global add @vue/cli
检查其版本是否正确: vue --version 若出现vue信息说明表示成功

我安装的是4.4.6 若想安装vue-cli指定版本 使用下面命令
npm install -g @vue/cli@版本号
想卸载vue
npm uninstall vue-cli -g 或 yarn global remove vue-cli

八、通过图形界面创建vue项目
git/cmd工具输入: vue ui
创建一个新项目 选择好路径 包管理工具都可以 推荐选择yarn

创建成功 右上角 自定义 添加运行任务

点击运行 前往任务页面

点击启动app

出现welcome则表示成功

再退出的切记要control+c终 止vue ui在关掉cmd或者git

九、 大部分还是在vscode中运行项目
:把项目放到vscode里 打开终端 快捷方式 ctrl+`
如果创建的时候包选择是yarn 则输入：yarn serve
如果创建的时候包选择是npm或默认 则输入：npm run serve

出现这个则表示成功