Vue安装步骤及使用教程

灰儿 · 2022-8-4 17:28:51

先从node官网下载并安装node.js,安装node.js的作用就是利用npm资源管理器下载插件等…

------把下载好的.exe文件双击安装，一直下一步就OK-------------

1.安装node.js
安装好的node试一下查看是不是安装成功,window键+r输入cmd进入系统管理器
进入系统命令页面输入 node -v 检查是否安装成功

2.安装npm管理器
npm包管理器，是集成在node中的，所以安装了node也就有了npm。有了npm就可以去下载资源库文件，可以通过命令进行下载了，先查看一下npm的版本号
npm -v

3.安装淘宝镜像(cnpm)
在系统管理台输入
npm install -g cnpm --registry=https://registry.npm.taobao.org 耐心等待，没有报错就是成功的，因为我是安装过的，所以会提示这个信息，有可能网络的原因，下载会慢点 …，安装成功后就可以用cnpm 代替npm下载资源文件

4.安装vue脚手架构建工具
在系统管理台输入
npm install -g vue-cli然后耐心等待安装…
如下图:

完成后，环境搭建和准备任务就差不多了，现在就可以用vue-cli来创建项目。可以在一个空白的文件下创建使用，这样显着不是太乱，不然等你的项目创建出来之后也不知道放哪里了。

5.创建空文件夹放入vue项目
输入 md vuedemo创建空文件，然后进入到vuedemo文件下
cd vuedemo

6.开始创建Vue-click项目
在命令行中运行命令 vue init webpack vueClickDemo,这个命令的意思是初始化一个项目，其中webpack是构建工具，也就是整个项目是基于webpack的。其中vueClickDemo是整个项目文件夹的名称，这个文件夹会自动生成在你指定的目录中。