零、前言
Vue.js 是一个 JavaScript 框架，允许您创建高性能的 web 应用。它拥有比竞争对手更小的学习曲线，并且有详细的文档，其中包含各种示例和用例。Vue.js 应用可以使用 Vue CLI 创建，也可以通过script标记将其包含在页面中，从而使其在没有构建系统的项目中非常易于使用。
与其他现代 web 框架/库类似，Vue.js 是组件驱动的，这意味着您可以使用自己的视图/数据逻辑创建自包含的单元。这使得我们的应用可以随着其变大而扩展，因为任何更改都可以彼此封装。
在扩展应用时，状态管理是前端领域的热门话题，Vue.js 通过Vuex库解决了这一问题。这允许我们在应用中定义操作并相应地采取行动，从而为我们提供可预测的状态，这些状态可用于形成用户界面和其他交互的基础。
本书探讨了所有这些以及更多内容，并举例说明了如何将这些原则应用到新的和旧的 Vue.js 应用中。
这本书是给谁的
本书面向对使用 JavaScript 创建 web 和移动应用感兴趣的人。由于本书中使用了现代 JavaScript 概念，因此之前使用 HTML5/ES2015 的经验将非常有用。你可能希望利用这些知识在你的个人项目或工作角色中创造基于网络的互动体验。
这本书涵盖的内容
第一章Vue.js 原理与比较向读者介绍 Vue.js，并激励他们将其作为一个框架来创建 web 应用。读者将了解 Vue.js 与其他流行框架（如 React 和 Angular）之间的差异。
第 2 章正确创建 Vue 项目探讨了创建 Vue 项目的适当方式。这包括使用 Webpack、Babel/TypeScript（用于 ES6）、.vue文件、linting 等。
第 3 章使用 Vue编写干净精简的代码，深入研究 Vue.js 实例和不同的保留属性，如data、computed、watch，以及创建 getter 和 setter。本章特别考虑何时使用计算属性以及何时使用监视属性。它还概述了为什么模板应该保持特别精简以便于维护。
第 4 章Vue.js 指令介绍了开发人员在编写反应式 Vue 应用时可以访问一组功能强大的指令，如v-for、v-if、v-model等。本章详细介绍每个指令，以及最佳实践和模式。此外，还介绍了如何使用速记语法进行事件绑定。
第 5 章与 Vue.js 组件的安全通信更深入地介绍了 Vue 组件，以及组件通信。我们将研究传递属性，以及验证道具类型，并考虑不同类型的属性和数据流。
第 6 章创建更好的 UI重点介绍 Vue 常见的 UI 模式。它还将介绍如何使用v-model从用户那里获取输入，以及如何绑定文本、复选框、单选按钮等输入。它还查看下拉和动态输入。最后，本章介绍表单提交和各种修改器，如延迟绑定、数字类型转换和字符串修剪。
第 7 章HTTP 和 WebSocket 通信介绍了将 HTTP 集成到 Vue.js 应用中的最佳实践。它将介绍Axios和发送 HTTP 请求的各种方法（即root instance/component/ nav guards。本章还将介绍如何使用socket.io，以及如何创建用于实时集成的基本 Node/Express API。
第 8 章Vue 路由模式描述了路由是任何 SPA 中至关重要的一部分。本章重点介绍 Vue 路由，并介绍如何在多个页面之间路由用户。它涵盖了从匹配路径和组件到使用导航参数、正则表达式等进行动态匹配的所有内容。
第 9 章使用 Vuex 进行状态管理演示了使用 Vuex 进行状态管理。本文首先介绍通量体系结构和单向数据流。然后，我们来看看 Vuex，一个针对 Vue 的状态管理系统。本章还将介绍如何在应用中实现这一点，以及常见的陷阱和使用模式。它接着进入Vue-devtools以捕获操作和 Vue 实例数据。
第 10 章测试 Vue.js 应用表明，测试是任何项目的重要组成部分，无论是框架还是语言。本章介绍如何测试我们的应用以及如何编写可测试代码。然后，我们将使用 Jasmine 和 Karma 测试我们的应用，以及在测试突变时测试我们的 Vuex 代码。
第 11 章、优化概述了部署 Vue 应用以及任何潜在的性能优化。然后将应用转换为渐进式 Web 应用（PWA），并添加ServiceWorkers、离线支持等功能。它还研究了减少总体捆绑包大小的方法，以及 SVG 在性能方面的优势。
第 12 章，使用 Nuxt进行服务器端渲染，展示使用 Nuxt 创建服务器端渲染的 Vue 应用的案例。该项目将使用 Vue CLI 创建，我们将查看从配置到路由、中间件和测试 Nuxt 的所有内容，一直到部署。
第 13 章、模式、帮助读者使用常见的反模式，并允许他们在编写 Vue.js 应用时避免这些原则。提出了一个风格指南，以及一些关键问题，如$parent的使用、$ref耦合问题、内联表达式等。
充分利用这本书
- 您应该已经了解 JavaScript（ES2015+），以及 HTML5 和 CSS3。
- 本书不要求有 Vue.js 方面的经验，尽管有其他 JavaScript 框架方面的经验将有助于比较和类似功能。
下载示例代码文件
您可以从您的账户www.packtpub.com下载本书的示例代码文件。如果您在其他地方购买了本书，您可以访问www.packtpub.com/support并注册，将文件通过电子邮件直接发送给您。
您可以通过以下步骤下载代码文件：
- 登录或注册www.packtpub.com。
-
选择“支持”选项卡。
-
点击代码下载和勘误表。
- 在搜索框中输入图书名称，然后按照屏幕上的说明进行操作。
下载文件后，请确保使用以下最新版本解压或解压缩文件夹：
- WinRAR/7-Zip for Windows
- 适用于 Mac 的 Zipeg/iZip/UnRarX
- 适用于 Linux 的 7-Zip/PeaZip
该书的代码包也托管在 GitHub 上的https://github.com/PacktPublishing/Vue.js-2-Design-Patterns-and-Best-Practices 。
我们的丰富书籍和视频目录中还有其他代码包，请访问https://github.com/PacktPublishing/ 。看看他们！
下载彩色图像
我们还提供了一个 PDF 文件，其中包含本书中使用的屏幕截图/图表的彩色图像。您可以在这里下载：https://www.packtpub.com/sites/default/files/downloads/Vuejs2DesignPatternsandBestPractices_ColorImages.pdf.
使用的惯例
本书中使用了许多文本约定。
CodeInText：表示文本中的码字、数据库表名、文件夹名、文件名、文件扩展名、路径名、虚拟 URL、用户输入和 Twitter 句柄。下面是一个示例：“将下载的WebStorm-10*.dmg磁盘映像文件作为系统中的另一个磁盘装载。”
代码块设置如下：
// my-module.js
export default function add(x, y) {
return x + y
}
任何命令行输入或输出的编写方式如下：
$ npm install
$ npm run dev
粗体：表示一个新术语、一个重要单词或您在屏幕上看到的单词。例如，菜单或对话框中的单词出现在文本中，如下所示。下面是一个示例：“从管理面板中选择系统信息。”
Warnings or important notes appear like this. Tips and tricks appear like this.
联系
我们欢迎读者的反馈。
一般反馈：发送电子邮件feedback@packtpub.com并在邮件主题中提及书名。如果您对本书的任何方面有疑问，请发送电子邮件至questions@packtpub.com。
勘误表：尽管我们已尽一切努力确保内容的准确性，但还是会出现错误。如果您在本书中发现错误，如果您能向我们报告，我们将不胜感激。请访问www.packtpub.com/submit-errata，选择您的书籍，点击 errata 提交表单链接，然后输入详细信息。
盗版：如果您在互联网上发现我们作品的任何形式的非法复制品，请您提供我们的位置地址或网站名称，我们将不胜感激。请通过copyright@packtpub.com与我们联系，并提供该材料的链接。
如果您有兴趣成为一名作家：如果您对某个主题有专业知识，并且您有兴趣撰写或贡献一本书，请访问authors.packtpub.com。
评论
请留下评论。一旦你阅读并使用了这本书，为什么不在你购买它的网站上留下评论呢？然后，潜在读者可以看到并使用您的无偏见意见做出购买决定，我们 Packt 可以了解您对我们产品的看法，我们的作者可以看到您对他们书籍的反馈。非常感谢。
有关 Packt 的更多信息，请访问packtpub.com。
版权属于：月萌API www.moonapi.com，转载请注明出处
