出处：葡萄城官网 https://www.cnblogs.com/powertoolsteam/p/11056531.html前言
如果你是Vue开发的老手，您可能曾经听过很多对于它的专业术语了，例如：单页面应用程序、异步组件、服务器端出现等。
另外您可能还常常听到和Vue一起提到的工具和库，如Vuex、Webpack、Vue CLI和Nuxt。
兴许您在面对这些未知的术语和工具时会感到无助和失望，没关系，您并不孤独，因为这是所有老手在首次接触Vue时都会有的感触。
但如果您试图要一次把握所有这些内容，那么这些宏大的体系很可能会压垮你。为此，我在这里将为大家展现一个“常识图表”，它蕴含了所有在业余Vue开发过程中的要害局部。您能够参考这个图为您在学习Vue的过程中指引方向。
Js和Web根底
如果我让你用英文去浏览纯英文书籍，那么你应该先要学习英文，对吗？
同样，Vue是一个用于构建Web用户界面的JavaScript框架。在开始应用Vue之前，您至多必须先要把握JavaScript和Web开发的基础知识
Vue概念根底
如果您是一个Vue的萌新开发，您应该专一于Vue.js 生态系统的外围，其中包含Vue外围库，Vue Router和Vuex。因为这些工具将会在绝大部分的Vue应用程序中利用。好的，那咱们开始介绍对于Vue的一些根底概念。
Vue外围性能
在根底状况下，Vue将网页和JavaScript放弃同步，实现这一指标的个性是响应式数据及指令和插值等模板性能，这些都是第一天要学习的内容。
在构建你的第一个Vue利用之前，你还必须要去理解如何在网页中去装置/应用Vue，以及理解Vue的援用实例的生命周期。
组件
Vue的组件是可重复使用，并互相独立的UI元素。您须要理解，如何申明组件，以及如何通过属性和事件使组件间通信。
并且学会组合组件也同样重要，因为这关乎着你是否可能应用Vue构建出一个强壮、可扩大应用程序。
单页面应用程序
单页面应用程序（SPA）架构决定了您创立的Web页面一样可能展现和多页面网站一样丰盛的内容，且不会当用户在点击链接后从新加载整个页面等这样低效的行为。
一旦您将您的“页面”创立成了一个Vue组件，您能够为每一个组件应用Vue Router，将每个申请映射到一个惟一的拜访门路上，Vue Router是一个由Vue团队保护的用于构建单页面应用程序（SPA）的工具。
状态治理
随着我的项目规模越来越宏大， SPA的许多页面上将会有越来越多的组件，治理全局状态也将变得越发辣手，组件因为大量的属性和事件监听器而变得臃肿。
一种称为“Flux”的非凡模式可将您的数据保留在稳固的地方存储中。Vuex库也由Vue团队保护，可祝您在Vue.js 应用程序中实现Flux。
学习生产环境中的Vue路线
您从第一局部取得的所有常识都可用于构建高性能和高效的Vue应用程序，尽管是容许在你的本地服务器上，那么，如何确保他们可能在理论生产环境下运行呢？
如果您要把基于Vue.js 的产品推向用户，您还须要理解更多内容，以下将为您介绍。
我的项目脚手架
如果您须要常常构建Vue应用程序，您会发现简直每个我的项目都会提供配置、设置和开发人员工具。
Vue团队保护了一个名为Vue CLI的工具，它能够让您在几分钟内构建一个弱小的Vue开发环境。
全栈 / 认证应用程序
Vue利用通常是数据驱动型的用户界面，数据通常是由Node、Laravel、Rails、
Django
或其余服务器框架编写的平安API作为起源。
兴许数据是由传统的REST API或GraphQL提供，再或者是Web Socket提供的实时数据。
另外你还应该相熟通常用于将Vue集成到全堆栈配置中的设计模式，以及在Vue应用程序中爱护用户数据安全的各种注意事项。
如果您正在评估什么后端产品是您开发Vue利用时的最好抉择，那么这篇文章中应该有您的答案。
测试
如果您想保障您的Vue应用程序在生产环境中体现的既可保护又稳固，您须要对您的利用提供实现的测试。
在Vue应用程序中，单元测试可确保您的组件始终为给定的输出（属性或用户输出的内容）提供雷同的属除（渲染好的HTML或事件）。
Vue团队保护着一个名为Vue Test Utils的工具，它容许您能对组件独自的创立和执行测试过程。
优化
当您将应用程序部署到近程服务器后，这个利用的访问速度和执行效率很可能不会像在开发阶段体现的那样迅速，很可能当用户拜访时速度会很慢。
为了晋升效率，咱们须要优化您的Vue利用，优化的过程咱们能够采纳各种技术，包含服务端渲染。在服务端渲染中，Vue程序将在服务端执行，在用户拜访时，将渲染实现的HTML出现给用户，从而达到晋升访问速度的目标。
当然，还包含其余优化技术，例如：异步组件和渲染性能。
要害工具链
到目前为止，咱们所看到的所有都来自Vue.js外围，或来自生态系统中的工具。但Vue不是孤立存在的，它只是前端技术栈中其中的一块。
高级开发中不应该仅仅相熟Vue，还要相熟一些其余要害工具，因为它可能将成为将来Vue利用其中的一部分。
古代JavaScript和Babel
ES5能够无效构建Vue应用程序，ES5简直是所有浏览器都反对的JavaScript规范。
为了加强Vue的开发体验，并应用最新的浏览器性能，您能够应用最新的JavaScript
规范ES2015的个性或ES2016及更高版本的倡议性能来构建您的Vue应用程序。
如果抉择应用了最新的JavaScript个性，那么其中旧版浏览器将会呈现兼容问题，这会造成您的产品将会损失掉一部分用户。
而如何对旧浏览器做兼容呢？Babel 能够实现这个目标，它的职责就是在应用程序公布前将您应用程序中古代个性“转换”（翻译和编译）为规范性能。
Webpack
Webpack是一个模块打包工具，意思是如果您的代码跨不同模块编写的（例如，不同的JavaScript文件），Webpack也能够全副将这些内容“构建”到一个浏览器可读的单个文件中。
Webpack 还能够构建流水线，它容许您在构建代码前进行转换。例如，应用后面铁道的Babel，Sass或TypeScript，还能够应用一系列插件来优化您的应用程序。
许多开发者认为Webpack很难了解，也很难配置，但如果没有它，Vue的一些最棒的性能（如：单页面组件）将无奈实现。咱们有对于WebPack的系列教程https://www.cnblogs.com/power...，助您疾速把握Webpack的应用和配置。
TypeScript
TypeScript是JavaScript语言的超集，它蕴含了（String，Boolean，Number等）。有了这样的类型定义，能保障您在开发期间就能编写出强壮和稳固的代码，能尽早发现错误。
行将于2019年推出的Vue.js 3将齐全用TypeScript开发，这并不意味着您必须在Vue我的项目中应用它。但如果您须要通过浏览Vue的外部代码并退出Vue的开源组织为其贡献力量，您至多也是应该要理解TypeScript这个语言的。
学习路线Vue框架
基于Vue创立的框架，使您无需从头开始实现服务端渲染，创立本人的组件库以及其余相似的工作。
目前有许多优良的Vue框架，但在这，咱们只列出了利用在不同畛域最为宽泛的三个框架。
逆锋起笔是一个专一于程序员圈子的技术平台，你能够播种最新技术动静、最新内测资格、BAT等大厂大佬的教训、增长本身、学习材料、职业路线、赚钱思维，微信搜寻逆锋起笔关注！
Nuxt.js
如果你想要构建一个高性能的Vue应用程序，同时还要基于路由、服务端出现、代码拆散和其余前沿个性，同时还须要一些更高级的性能，例如：SEO标记等。您能够应用Nuxt.js框架。
Nuxt.js框架通过其丰盛的社区插件提供了所有这些开箱即用的个性，以及更多的个性，如PWA等。
Vuetify
Google的Material Design规范是一个宽泛应用的设计语言指南零碎，它用于构建丑陋并正当的用户界面，这些界面被广泛应用于Google的产品，如Android和Web零碎。
Vuetify框架在一系列Vue组件中实现了Material Design。这容许您应用Material Design布局和款式疾速创立Vue应用程序，并在应用程序中实现模态框、提示框、导航栏、分页等页面小控件。
NativeScript-Vue
Vue.js 是一个用于构建Web用户界面的库。如果您想将他用于构建挪动利用，您能够应用NativeScript-Vue框架。
NativeScript是一个应用iOS和Android上原生用户界面组件构建利用app的框架，而NativeScript-Vues 是基于NativeScript且反对Vue语法和Vue组件应用的框架。
其余学习
在最初一部分中，咱们将介绍一些重要但不蕴含在上述分类中的内容。
插件开发
如果您要在我的项目中重用Vue性能，或为Vue生态做出奉献，您能够把这部分性能打包成插件并公布给其余用户。
插件性能是Vue的一个重要个性，有很多工具和模板能够帮忙您创立轻便高效的Vue代码。
动画
动画也是 Vue外围性能的一部分，它容许您在向DOM中增加或删除元素时利用动画。为了启用一个动画，您能够创立CSS类来定义所需的动画成果，无论是淡入淡出、更改色彩还是任何其余成果。Vue将检测当增加元素和删除元素时，增加或删除您设置相应的类。
渐进式Web应用程序
渐进式Web应用程序（PWA）与一般的Web应用程序相似，但用户体验、性能曾经失去了加强，同时还减少了古代性能，例如，PWA包含离线缓存、服务端渲染、告诉推送等。
大部分PWA性能能够通过Vue CLI 3插件或主入Nuxt.js之类的框架轻松增加到Vue利用中，但您最好依然须要去学习其中的关键技术，包含Web利用json清单（minifest）和服务等技术。
逆锋起笔是一个专一于程序员圈子的技术平台，你能够播种最新技术动静、最新内测资格、BAT等大厂大佬的教训、增长本身、学习材料、职业路线、赚钱思维，微信搜寻逆锋起笔关注！