vue学习第一天,记录一下安装步骤

vue学习第一天,记录一下安装步骤以及遇到的问题和解决办法

第一步,先安装Node.js


Node.js 安装包及源码下载地址为:https://nodejs.org/en/download/。

vue学习第一天,记录一下安装步骤
可以根据不同平台系统选择你需要的 Node.js 安装包。
我这里下载的windows 64位版本的.msi

vue学习第一天,记录一下安装步骤

双击,傻瓜式安装就可以了(记得修改安装目录),安装完成后进入cmd检查node版本

vue学习第一天,记录一下安装步骤

这样就说明安装成功了。

第二步:安装VUE并创建第一个项目


1、安装npm镜像


这里用淘宝镜像
在cmd窗口执行:npm install -g cnpm --registry=https://registry.npm.taobao.org

vue学习第一天,记录一下安装步骤
2、安装脚手架


在cmd窗口执行:cnpm install -g webpack
这里比较慢,等一会出现All packages installed...后说明安装成功

3、安装vue


然后执行:cnpm install -g vue-cli 
同样出现All packages installed...后说明安装成功
然后执行:vue -V

vue学习第一天,记录一下安装步骤

出现上面的情况,说明vue安装成功。

4、创建并启动项目


执行:vue init webpack my-project

vue学习第一天,记录一下安装步骤

 

出现以上结果后,说明创建成功。

然后执行:cd my-project
跳到my-project目录后执行:npm intall或者cnpm installvue学习第一天,记录一下安装步骤

出现All packages installed 说明项目install成功了。

然后执行:npm run dev 或者cnpm run dev 

vue学习第一天,记录一下安装步骤

当出现上面I  Your application is running here: http://localhost:8080的情况时说明创建的项目启动成功了,浏览器访问 http://localhost:8080就可以看到初始页面了vue学习第一天,记录一下安装步骤

期间遇到的问题及解决办法:

1、执行cnpm intall时报错:Error: EBUSY: resource busy or locked, symlink

vue学习第一天,记录一下安装步骤

解决办法:关闭电脑的杀毒软件,重新执行cnpm intall 成功。

 

2、执行cnpm run dev 时报错:Error: Cannot find module 'http-errors'

vue学习第一天,记录一下安装步骤

解决办法:
1.找到项目中的node_modules文件 删除它;
2. 重新install安装所需依赖即可;

 

第一次接触vue,目前主要通过菜鸟教程(https://www.runoob.com/vue2/vue-install.html)和vue官网(https://cn.vuejs.org/)学习,在此记录一下学习历程,希望各位大佬多多指教~