Vuejs前端开发实战（第2版）.pptxVIP

第1章初识Vue.js《Vue.js前端开发实战（第2版）》

学习目标/Target了解前端技术的发展，能够说出使用框架开发项目的优势了解什么是Vue，能够说出Vue的基本概念了解Vue的特性，能够说出Vue的4个特性了解Vue的版本，能够说出Vue2和Vue3的区别

学习目标/Target掌握VisualStudioCode编辑器的使用方法，能够使用VisualStudioCode编辑器进行项目开发掌握Node.js环境的搭建，能够独立完成Node.js的下载和安装掌握常见的包管理工具的使用方法，能够应用npm和yarn相关命令下载、升级、卸载包掌握Vite的使用方法，能够使用Vite创建Vue3项目

章节概述/Summary在前端开发中，一个优秀的框架可以帮助用户解决一些常见的问题，有助于高效地完成工作。Vue.js（简称Vue）作为前端开发常用的框架之一，不仅可以提高项目的开发效率，而且可以改善开发体验。为了帮助读者对Vue有一个初步的认识，本章将对Vue的基础知识进行详细讲解。

目录/Contents前端技术的发展Vue简介Vue开发环境1.4使用Vite创建Vue3项目

前端技术的发展1.1

了解前端技术的发展，能够说出使用框架开发项目的优势1.1前端技术的发展先定一个小目标！

前端开发的基础语言为HTML、CSS和JavaScript，其中，HTML用于搭建页面的内容结构；CSS用于美化页面的显示效果；JavaScript用于处理用户和页面之间的交互行为。1.1前端技术的发展

当开发大型交互式项目时，开发者需要编写大量的JavaScript代码来操作文档对象模型（DocumentObjectModel，DOM）并处理浏览器的兼容性问题。为了简化DOM操作和减少开发过程中的浏览器兼容性问题，jQuery提供了一个选择器引擎，它比其他引擎查询速度更快，并为不同浏览器之间的JavaScript不兼容提供了隐式处理方法，因此jQuery深受开发人员的欢迎。jQuery的核心思想是使开发人员仅编写少量的代码就能实现更多的功能。1.1前端技术的发展

在移动互联网时代，前端技术被应用于移动端开发中。为了使移动端网页的使用体验更接近用户习惯，移动端网页通常会做成单页Web应用（SinglePageWebApplication）的形式。单页Web应用在使用过程中只需要加载一个HTML页面，而传统的网页是用户每单击一个链接都需要加载相应的HTML页面。需要说明的是，单页Web应用并不是只能显示一个页面，所谓“单页”是对浏览器而言的，而开发者可以利用Ajax技术实现逻辑上的页面切换的效果。1.1前端技术的发展

为了提高开发效率，市面上出现了基于MVVM模式的前端开发框架，例如Angular、React、Vue等。这些框架以数据为核心，使用户关注业务逻辑的处理，减少了手动的DOM操作。这些框架还为开发者提供了一套开发规则，控制权在框架本身，用户需要按照框架的规范进行开发。与jQuery相比，使用框架开发的项目具有更高的开发效率、更好的可维护性、更强的可扩展性和更高的性能。在Angular、React和Vue这3个框架中，Vue体积较小，在使用上更容易上手、更加灵活。1.1前端技术的发展

多学一招：什么是单页Web应用单页Web应用将所有的功能局限于一个Web页面中，仅在该页面的初始化时加载相应的资源（必要的HTML、CSS和JavaScript代码）。在页面加载完成后，所有的操作都在这个页面上完成，且不会因用户的操作而进行页面的重新加载或跳转，而是利用JavaScript动态地变换页面的内容，从而实现页面与用户的交互。1.1前端技术的发展

多学一招：什么是单页Web应用单页Web应用有以下3个优点。良好的交互体验。在单页Web应用中，内容的改变不需要重新加载整个页面，响应速度更快。良好的前后端分离开发模式。后端专注于提供API，更容易实现API的复用。减轻服务器的压力。单页Web应用中的数据是通过Ajax获取的，不需要重新加载，服务器的压力较小。1.1前端技术的发展

多学一招：什么是单页Web应用任何一种技术都有局限性，对于单页Web应用来说，主要的问题有以下2个。①首屏加载慢，在首次加载时需要将页面中所用到的资源全部加载。②不利于有哪些信誉好的足球投注网站引擎优化（SearchEngineOptimization，SEO）。对于单页Web应用，有哪些信誉好的足球投注网站引擎请求到的HTML页面可能不是包含所有数据的最终渲染页面，这样就很不利于内容被有哪些信誉好的足球投注网站引擎有哪些信誉好的足球投注网站到。1.1前端技术的发展

多