第一个 vue-cli项目

什么是vue-cli

vue-cli官方提供的一个脚手架,用于快速生成一个vue的项目模板;

预先定义好的目录结构及基础代码,就好比咱们在创建Maven项目时可以选择创建一个骨架项目,这个骨架项目就是脚手架,我们的开发更加的快速

主要的功能:

  • 统一的目录结构
  • 本地调试
  • 热部署
  • 单元测试
  • 集成打包上线

需要的环境:

可以使用如下语句进行验证:

1

1.安装Node.js淘宝镜像加速器(cnpm)

# -g 就是全局安装
npm install cnpm -g

# 或使用如下语句解决npm速度慢的问题
npm install --registry=https://registry.npm.taobao.org

安装的位置:C:\用户\xxxx\AppData\Roaming\npm

2.安装vue-cli

cnpm install vue-cli -g
#测试是否安装成功
#查看可以基于哪些模板创建vue应用程序,通常我们选择webpack
vue list

2

创建第一个Vue-cli项目

1.创建一个 Vue项目 文件夹

2.cmd 进入这个文件夹的目录下

vue init webpack xxxx

即:在该目录下创建一个vue-cli项目

3

  • 前三个就是填 项目名、项目描述、作者名
  • 第四个选择 第一个
  • 后面的全部 no

完成后会出现一个文件夹,内容为 :

4

3.初始化并运行

cd xxxx   #进入新出来的文件夹,xxxx即你上面的文件夹名

npm install    # 全局安装

npm run dev    # 运行

5

6

个人博客为:
MoYu’s Github Blog
MoYu’s Gitee Blog

版权声明:本文为MoYu-zc原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://www.cnblogs.com/MoYu-zc/p/14674598.html