Vue脚手架

vue脚手架是什么？

---

1. 摘要：vue脚手架指的是vue-cli，它是一个专门为单页面应用快速搭建繁杂的脚手架，它可以轻松的创建新的应用程序而且可用于自动生成 vue 和 webpack 的项目模板，Vue是一个用于构建用户界面的渐进式框架。它是可以自底向上逐层应用...

在了解 vue脚手架 是什么之前，要先了解其他的一些概念：

CLI：

命令行界面（英语：command-line interface，缩写：CLI）是在图形用户界面得到普及之前使用最为广泛的用户界面，它通常不支持鼠标，用户通过键盘输入指令，计算机接收到指令后，予以执行。也有人称之为字符用户界面（CUI）。

Node.js：

Node.js 是一个事件驱动 I/O 服务端 JavaScript 环境，基于 Google 的 V8 引擎，V8 引擎执行 Javascript 的速度非常快，性能非常好，简单的说就是运行在服务端的 JavaScript。

NPM:

NPM的全称是 Node Package Manager，是一个 NodeJS 包管理和分发工具，已经成为了非官方的发布Node模块（包）的标准，管理前端各种依赖。

设置淘宝镜像：
npm config set registry https://registry.npm.taobao.org

验证镜像
npm config get registry

设置npm默认安装目录及缓存目录
npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"

脚手架：

在软件开发上（当然也包括前端开发）的脚手架指的就是：有人帮你把这个开发过程中要用到的工具、环境都配置好了，你就可以方便地直接开始做开发，专注你的业务，而不用再花时间去配置这个开发环境，这个开发环境就是脚手架。

vue脚手架：

vue脚手架指的是vue-cli，它是一个专门为单页面应用快速搭建繁杂的脚手架，它可以轻松的创建新的应用程序而且可用于自动生成 vue 和 webpack 的项目模板。

Vue是一个用于构建用户界面的渐进式框架。它是可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或者现有的项目进行整合。 另一方面当与现代化的工具链以及各种支持类库结合使用时，Vue也完全能够为复杂的单页应用提供驱动，接下来将介绍Vue中的一个重要内容vue-cli，就有一定的参考价值，希望对大家有所帮助。

vue脚手架的简单使用

1.安装vue脚手架：

npm install -g vue-cli  

添加vue命令到path环境变量
我的电脑-属性-高级系统设置-环境变量-path-添加：

D:\nodejs\node_global

2.通过vue脚手架创建一个项目：

vue init webpack 项目名

webpack: 它主要用途是通过CommonJS 的语法把所有浏览器端需要发布的静态资源作相应的准备，比如资源的合并和打包。

3.运行vue脚手架项目：

进入到项目的根目录，然后在项目根目录执行： 

npm start

4.访问vue项目：

浏览器打开启动后的地址，如：

http://localhost:8080/

5.vue-cli项目打包及部署：

进入到项目的根目录，然后在项目根目录执行：

npm run build

运行完成之后，会出现一个 dist 目录，这个就是打包后的文件，直接拷贝到服务器部署就可以了