小型电商页面实践-Vant UI框架实践-（1）安装

以下的种种纯属于个人学习的笔记，处于阶段暂时不是很忙，抽空重新梳理一下之前学习的一些零碎的东西，整合学习，也是很有必要。

加上最近Vue退出的最新的脚手架3.0也很期待，苦于没什么闲暇的时间进行实践。以下的记录纯属个人为学习笔记。

按vant官网文档指示操作：

1：vue-cli 脚手架安装

npm install -g @vue/cli

2：新建一个项目

F:\>cd zyx-code\vue_pro

F:\zyx-code\vue_pro>

开始安装项目
# 创建一个项目
vue create hello-world

image.png

image.png

image.png

3：使用图形化界面打开创建的项目

image.png

使用QQ浏览器打不开，使用谷歌才行：

image.png

选择导入项目：

image.png

image.png

在图形化界面中，点击依赖 -> 安装依赖，然后将 vant 添加到依赖。

image.png

image.png

等待安装完成。

image.png

还可以选择性添加相关的插件：

image.png

image.png

4：运行项目：

F:\zyx-code\vue_pro\hello-world>npm run serve
  App running at:
  - Local:   http://localhost:8080/
  - Network: http://192.168.1.196:8080/

  Note that the development build is not optimized.
  To create a production build, run npm run build.

image.png