转载请注明出处，未经同意，不可修改文章内容。
🔥🔥🔥“前端一万小时”两大明星专栏——“从零基础到轻松就业”、“前端面试刷题”，已于本月大改版，合二为一，干货满满，欢迎点击公众号菜单栏各模块了解。
1 说明
在真实项目开发过程中，我们常常会借助 Webpack 这种打包工具去构建大型项目的开发目录。并在开发完成后，进行打包的操作，以帮助我们把代码打包生成一个线上可运行的最终代码。
但如果让每个开发人员自己去配置 Webpack 的开发环境，对于开发者来说是一个不小的挑战。
Vue 官方也考虑到了这个因素，为我们提供了一款“脚手架”工具——vue-cli。
通过这个“脚手架”，我们可以快速地构建一个标准的 Vue 项目。同时，这个工具自带了 Webpack 的各种配置。
借助这个工具，我们可以上手“工程级别”的 Vue 项目开发，且不会有任何使用门槛。
接下来，我们就进行 vue-cli 的安装和使用。
2 安装和使用
- 终端输入以下命令行并“回车”（Vue CLI 最新版本的包名为
@vue/cli，已安装旧版本vue-cli的话，可暂不重复安装；若想升级新版本，需要卸载旧版本vue-cli后再安装）：
npm uninstall -g vue-cli // ❗️卸载旧版本 vue-cli（没安装过的话，跳过此步骤）；
npm install -g @vue/cli // ①：全局安装脚手架工具 @vue/cli；
vue --version // ②：安装完成后可使用此命令查看 Vue CLI 版本；
npm install -g @vue/cli-init // ③：安装桥接工具，继续使用 vue-cli2.x 版本的功能。
（❗️注：新版本脚手架相比于旧版本，用法大同小异。在我们的 qdywxs-travel 项目开发中，将基于 vue-cli2.x 版本进行。待项目完成后，会将项目升级至 vue-cli3.x 版。）
- 切换到
Desktop：
cd Desktop
3. 创建项目（例如我们创建项目 qdywxs-travel ），输入以下命令行并“回车”（参考下方视频即可）：
vue init webpack qdywxs-travel
- 项目创建好后，我们可以执行一下两条命令启动 server，并打开
http://localhost:8080查看效果：
cd qdywxs-travel
npm run dev
以上，我们就使用 Vue 的“脚手架”搭建好了项目雏形。
祝好，qdywxs ♥ you！
