vue cli脚手架详解_vue3.x项目实战，用vue-cli脚手架创建新项目

大家好，我是羊歌，欢迎收看《羊歌编程笔记》。

在上一集的视频当中呢，我们和大家分享了vue-cli最新版本的安装，在今后的课程中，我们将不再通过CDN引入的方式来进行课程的讲解，我们将通过脚手架的方式跟大家分享新项目的开发。那么本次视频呢我们和大家分享一下通过vue-cli来进行项目的创建！

首先来看一下我们今天课程的学习大纲。

vue3.x学习大纲

Vue3.x介绍我们就不说了，那么我们vue3.x的发布时间呢是2020 年 9 月 19 日。

vue-cli 脚手架工具安装我们在上集视频中，已经和大家安装完成了，那么今天呢，我们就和大家来分享一下通过 Vue-cli来创建项目。 它是怎么创建的呢？Vue create mydemo01，这就是它的创建方法。我们接着看，一会儿，我们用图片来展示一下。项目创建完成后呢，用npm run serve或者是yarn serve来把项目启动起来。

好，我们现在去看演示啊。大家看，我们通过win+r来打开终端输入cmd。

win+r来打开终端输入cmd

 我们先来看看上集视频中安装的脚手架版本号是多少？来我们输入vue -V,它的版本号是@vue/cli 4.5.9，出来了。

版本号是@vue/cli 4.5.9

好，我们现在来创建项目，大家注意看啊，我们现在创建一个项目，我们输入vue create vuedemo001我们按回车，下面出现了一个选择项，有vue2,vue3,我们用上下箭头选择VUE3,下一步让你用yarn或者是npm，我们选择npm来安装一下啊，我们按回车。

选择VUE3

vuedemo001项目创建

好，安装成功，我们先看这两行$ cd mydemo02还有一个是 $ npm run serve，意思就是我们要先进入到这个目录里，然后在运行。好，我们试试 ,我们把它cd vuedemo001复制一下，然后粘贴。好，进入vuedemo001的目录里了，然后启动项目，来我们再把npm run serve复制一下，然后粘贴，我们按个回车，看看效果。

启动项目

最终展示