vue从入门到放弃之------详细介绍Vue Cli的使用

一、Vue Cli是什么

Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统，使用 Vue Cli之后我们可以快速的搭建一个完整的系统(项目)。

二、Vue Cli的安装

1、安装Vue Cli需要先安装nodeJs(教程很多，在此就不多说了)

2、安装Vue Cli

npm install -g @vue/cli

安装完成之后可以使用如下命令查看vue版本

vue --version

可以通过如下命令升级vue版本

npm update -g @vue/cli

三、Vue Cli使用

使用vue cli创建项目的方式有命令行和图形化界面方式两种。

1、界面方式

vue ui

通过命令行执行上述命令，就会在浏览器中弹出对应的操作页面，然后在页面中按步骤执行即可，在此不做过多讲述。

2、命令行方式

<1>、在命令行输入如下命令后回车

vue create hello-world

<2>、选择vue默认的配置还是手动配置，此处我们选择了第二个，手动配置，然后点击回车

<3>、选择手动配置后，会出现下列的配置项供你选择，选择的手动配置的配置项，点击空格为是否选择，上下键控制移动，我们选择了如下地选择：

<4>、选择配置项后回车，会对选中的配置项做出配置，如下所示：

<5>、然后一直回车到自己执行，出现如下所示的命令行，则表示项目创建完成：

<6>、执行上述的两行命令，将会启动项目，弹出对应访问项目的链接：

<7>、在浏览器输入对应的链接回车后，就会看到启动的项目，这样，一个Vue Cli创建的项目就完成了。

 

 

 

2021 How time flies.