如何使用vue-cli快速搭建项目

vue

vue-cli是vue中一个强大的构建工具，大大降低了webpack的使用难度，支持热更新。使用vue-cli使你快速的搭建项目。

首先，你得要先安装vue-cli，那么在安装之前你得先确认一下你的电脑有没有node.js（如果没有，那么请先安装node）,有了node以后直接在命令行进行操作：

全局安装：npm install -g vue-cli

安装完成之后输入：vue -V查看版本号，注意后面的v一定是大写的；

OK,安装成功！

接下来你就可以新建一个文件夹用来存放项目，然后在这个文件夹下打开命令行：

vue init webpack map

那么在这里：

init 表示我要用vue-cli来初始化项目

webpack 模板名称

map 表示项目名称自定义

开始安装后会有提示，如下图（可按下图提示进行）：

接下来就等待安装成功：

好了，现在项目已经搭建成功，cd进入项目文件夹，然后在命令行输入：

npm install

下载安装依赖，下载完成后，进入项目文件夹可以看到，脚手架已经为我们搭好了基础，剩下的部分就靠我们自己进行开发了：

那么src下就是我们页面的存放区域，我们在开发项目时，会在这里面创建各个单页面组件和组件之间的路由跳转以及组件之间的传值。static是放置静态文件的区域，在这里我们可以存放css,js以及img。

详细的项目目录结构如图：