前端工程化:基于Vue.js 3.0的设计与实践9787111724773
正版图书,可开发票,请放心购买。
¥
89.25
7.5折
¥
119
全新
库存52件
作者程沛权著
出版社机械工业出版社
ISBN9787111724773
出版时间2023-05
装帧平装
开本16开
定价119元
货号12459374
上书时间2024-12-22
商品详情
- 品相描述:全新
- 商品描述
-
前言
Vue 3.0从2020年9月中旬正式发布到2022年2月代替Vue 2成为Vue的默认版本。经过长达一年半的市场验证,已经证明了它可以完美地支持常见的企业需求,适合投产使用,未来会被越来越多的企业所采用,只掌握Vue 2远远不能满足企业的技能要求。
本书以Vue.js的3.0版本为核心技术栈,围绕“前端工程化”和TypeScript的知识点展开讲解,主要内容如下:
1)如何进行前端工程化开发,掌握Node.js和npm的使用。
2)前端领域多年来受欢迎趋势走高、带有类型支持的TypeScript 语言。
3)上手主流前端框架Vue.js的全新版本,并且在遇到常见问题时知道如何解决。
本书全面融入了笔者多年的开发实践经验,大部分知识点都搭配了通俗易懂的讲解和可实现的代码案例,在阅读的过程中读者可以亲自编写代码加强学习,毕竟上手一个新技术栈最快的方法,就是边学边练。
本书作为一本入门类教程,主要面向以下读者人群:
1)掌握了基础的HTML页面编写知识,想学习一个主流前端框架的新手前端工程师。
2)已经掌握Vue 2 ,面对Vue 3的大版本更新想快速上手使用的前端工程师。
3)非职业前端开发人员,但涉及前端的工作,需要掌握一个主流前端框架的全栈工程师。
本书根据笔者多年的前端开发经验和一线团队管理经验,将Vue 3的知识点按照工程项目的实施顺序梳理成章,一步一步帮助工程师入门前端工程化和Vue 3的开发。
书中包含了很多在构建项目过程中容易遇到的问题点和解决方案,对Vue 3和Vue 2差异化较大的功能点还进行了版本之间的写法对比。这一点和各技术栈的官方文档有较大的不同,官方文档更适合作为一本工具书,方便在需要的时候对API 进行检索查询。
目前笔者所带领的前端团队已经全员使用TypeScript和Vue 3进行日常的开发工作,团队成员的学习过程都非常顺利,各位读者可放心阅读。笔者推荐按照本书章节的顺序进行学习,从前端工程化开始到TypeScript语言的学习,再到使用TypeScript开发Vue 3项目,这是一个循序渐进的学习过程。
Vue.js是一个 “渐进式”的框架,它可以只用最基础的组件来开发一个小项目,也可以引入相关生态组合成一个大项目(如Vue Router、 Vuex、 Pinia等)。本书和Vue.js 框架一样,也是一个“渐进式”的教程,对于本身已经有一定Vue.js基础的开发者来说,也可以在遇到具体问题的时候,只阅读对应部分的内容。
在学习的过程中,笔者推荐将已有的其他技术栈项目使用Vue 3重新编写,使其可以复刻原来的功能。比如一个使用jQuery或者是Vue 2编写的活动页面或小工具,用Vue 3重新实现一遍,看能否还原出原来的功能。如果能够成功实现,则说明已经掌握Vue 3的使用技巧了。在学习的过程中如有什么问题想与笔者交流,可以给笔者发送邮件,邮箱是chengpeiquan@chengpeiquan.com。由于水平所限,书中难免有疏漏之处,请广大读者不吝赐教。
笔者
2022.11.30
商品简介
本书以Vue.js的3.0版本为核心技术栈,围绕“前端工程化”和TypeScript的知识点展开讲解,根据笔者多年的前端开发和一线团队管理经验,将Vue 3的知识点按照工程师做项目的实施顺序梳理成章,一步一步帮助读者进行前端工程化和Vue 3的开发。从前端工程化开始到TypeScript语言的学习,再到使用TypeScript开发Vue 3项目,通过循序渐进的学习过程提升读者在前端工程化领域的实战能力。
本书大部分知识点都搭配了通俗易懂、可实现的代码案例,读者扫描封底的二维码可获得随书附赠的源代码等资源。本书适合计算机前端开发技术人员、前端技术团队管理人员和相关专业的在校大学生阅读。
作者简介
程沛权,养了三只猫的程序员,热爱烹饪、设计和音乐。在前端领域有多年的开发经验和一线开发团队管理经验,曾在网易和UC工作超过7年,在网易工作期间担任内训讲师,有过近百篇的项目经验与教程分享,开展过多次跨部门业务培训课,为多个团队新成员带来有效的快速成长。
目录
前言
第1章 前端工程化概述
1.1传统开发的弊端
1.2工程化带来的优势
1.2.1开发层面的优势
1.2.2团队协作的优势
1.2.3求职竞争上的优势
1.3Vue.js与工程化
1.3.1了解Vue.js与全新的3.0版本
1.3.2Vue与工程化之间的关联
1.3.3选择Vue入门工程化的理由
1.4现代化的开发概念
1.4.1MPA与SPA
1.4.2CSR与SSR
1.4.3Pre-Rendering与SSG
1.4.4ISR与DPR
1.5工程化不止于前端
1.5.1服务端开发
1.5.2App开发
1.5.3桌面程序开发
1.5.4应用脚本开发
1.6实践工程化的流程
1.7工程化利器Node.js
1.7.1Node.js
1.7.2Runtime
1.7.3Node和浏览器的区别
1.8工程化的构建工具
1.8.1为什么要使用构建工具
1.8.2Webpack
1.8.3Vite
1.8.4两者的区别
1.8.5开发环境和生产环境
第2章 工程化的前期准备
2.1命令行工具
2.1.1Windows
2.1.2macOS
2.2安装Node环境
2.2.1下载和安装Node
2.2.2版本之间的区别
2.3基础的Node项目
2.3.1初始化一个项目
2.3.2了解package.json
2.3.3项目名称规则
2.3.4语义化版本号管理
2.3.5脚本命令的配置
2.3.6Hello Node
2.4学习模块化设计
2.4.1模块化解决了什么问题
2.4.2如何实现模块化
2.4.3用 CommonJS 设计模块
2.4.4用 ES Module 设计模块
2.5认识组件化设计
2.5.1什么是组件化
2.5.2解决了什么问题
2.5.3如何实现组件化
2.6依赖包和插件
2.6.1包
2.6.2node_modules
2.6.3包管理器
2.6.4依赖包的管理
2.6.5如何使用包
2.7控制编译代码的兼容性
2.7.1如何查询兼容性
2.7.2Babel的使用和配置
第3章 快速上手TypeScript
3.1为什么需要类型系统
3.2Hello TypeScript
3.3常用的 TS 类型定义
3.3.1原始数据类型
3.3.2数组
3.3.3对象(接口)
3.3.4类
3.3.5联合类型
3.3.6函数
3.3.7任意值
3.3.8npm 包
3.3.9类型断言
3.3.10类型推论
3.4如何编译为 JavaScript 代码
3.4.1编译单个文件
3.4.2编译多个模块
3.4.3修改编译后的JavaScript版本
3.4.4其他事项
3.5了解 tsconfig.json
第4章 脚手架的升级与配置
4.1全新的 Vue 版本
4.1.1使用 Vue 3
4.1.2使用 Vue 2
4.2Hello Vue 3
4.3使用 Vite 创建项目
4.3.1create-vite
4.3.2create-vue
4.3.3create-preset
4.3.4管理项目配置
4.4使用 @vuecli 创建项目
4.4.1CLI和Vite的区别
4.4.2更新 CLI 脚手架
4.4.3使用 CLI 创建 3.x 项目
4.4.4管理项目配置
4.5调整TypeScript Config
4.6添加协作规范
4.6.1Editor Config
4.6.2Prettier
4.6.3ESLint
4.7安装 VSCode
4.8添加 VSCode 插件
4.8.1Chinese (Simplified)
4.8.2Volar
4.8.3Vue VSCode Snippets
4.8.4Auto Close Tag
4.8.5Auto Rename Tag
4.8.6EditorConfig for VSCode
4.8.7Prettier for VSCode
4.8.8ESLint for VSCode
4.8.9其他插件
4.9项目初始化
4.9.1入口文件
4.9.2回顾 Vue 2的入口文件
4.9.3了解 Vue 3的入口文件
4.10Vue Devtools
第5章 单组件的编写
5.1全新的 setup 函数
5.1.1setup的含义
5.1.2setup的参数使用
5.1.3defineComponent的作用
5.2组件的生命周期
5.2.1升级变化
5.2.2使用 3.x的生命周期
5.3组件的基本写法
5.3.1回顾 Vue 2中组件的基本写法
5.3.2了解 Vue 3中组件的基本写法
5.4响应式数据的变化
5.4.1设计上的变化
5.4.2用法上的变化
5.5响应式 API:ref
5.5.1类型声明
5.5.2变量的定义
5.5.3DOM 元素与子组件
5.5.4变量的读取与赋值
5.6响应式 API:reactive
5.6.1类型声明与定义
5.6.2变量的读取与赋值
5.6.3特别注意事项
5.7响应式 API:toRef 与 toRefs
5.7.1它们各自的作用
5.7.2使用 toRef
5.7.3使用 toRefs
5.7.4为什么要进行转换
5.7.5什么场景下比较适合使用它们
5.7.6在业务中的具体运用
5.7.7需要注意的问题
5.8函数的声明和使用
5.9数据的侦听
5.9.1watch
5.9.2watchEffect
5.9.3watchPostEffect
5.9.4watchSyncEffect
5.10数据的计算
5.10.1用法变化
5.10.2类型声明
5.10.3优势对比和注意事项
5.10.4setter的使用
5.10.5应用场景
5.11指令
5.11.1内置指令
5.11.2自定义指令
5.12插槽
5.12.1默认插槽
5.12.2具名插槽
5.12.3默认内容
5.12.4注意事项
5.13CSS 样式与预处理器
5.13.1编写组件样式表
5.13.2动态绑定 CSS
5.13.3样式表的组件作用域
5.13.4深度操作符
5.13.5使用 CSS 预处理器
第6章 路由的使用
6.1路由的目录结构
6.2在项目里引入路由
6.2.1回顾 Vue 2的路由
6.2.2了解 Vue 3的路由
6.3路由树的配置
6.3.1基础格式
6.3.2公共基础路径
6.3.3一级路由
6.3.4多级路由
6.3.5路由懒加载
6.4路由的渲染
6.5使用 route 获取路由信息
6.6使用 router 操作路由
6.7使用 router-link 标签跳转
6.7.1基础跳转
6.7.2带参数的跳转
6.7.3不生成 a 标签
6.8在独立TypeScriptJavaScript文件里使用路由
6.9路由元信息配置
6.10路由重定向
6.10.1基本用法
6.10.2业务场景
6.10.3配置为 path
6.10.4配置为 route
6.10.5配置为 function
6.11路由别名配置
6.12404 路由页面配置
6.13导航守卫
6.13.1钩子的应用场景
6.13.2路由里的全局钩子
6.13.3在组件内使用全局钩子
6.13.4路由里的独享钩子
6.13.5组件内单独使用
6.14路由侦听
6.14.1watch
6.14.2watchEffect
6.15部署问题与服务端配置
6.15.1常见部署问题
6.15.2服务端配置方案
第7章 插件的开发和使用
7.1插件的安装和引入
7.1.1通过 npm 安装
7.1.2通过 cnpm 安装
7.1.3通过 yarn 安装
7.1.4通过 pnpm 安装
7.1.5通过 CDN 安装
7.1.6插件的引入
7.2Vue 专属插件
7.2.1全局插件的使用
7.2.2单组件插件的使用
7.3通用JavaScriptTypeScript插件
7.4本地插件
7.4.1封装的目的
7.4.2常用的本地封装类型
7.4.3开发本地通用JavaScriptTypeScript插件
7.4.4开发本地 Vue 专属插件
7.5全局 API 挂载
7.5.1回顾 Vue 2的全局API挂载
7.5.2了解 Vue 3的全局API挂载
7.5.3定义全局 API
7.5.4全局 API的替代方案
7.6npm 包的开发与发布
7.6.1常用的构建工具
7.6.2项目结构与入口文件
7.6.3开发 npm 包
7.6.4生成 npm 包的类型声明
7.6.5添加说明文档
7.6.6发布 npm 包
第8章 组件之间的通信
8.1父子组件通信
8.2propsemits
8.2.1下发 props
8.2.2接收 props
8.2.3配置带有类型的 props
8.2.4配置可选以及带有默认值的 props
8.2.5使用 props
8.2.6传递非 props的属性
8.2.7获取非 props的属性
8.2.8绑定 emits
8.2.9接收并调用 emits
8.2.10接收 emits 时做一些校验
8.3v-modelemits
8.3.1绑定 v-model
8.3.2配置 emits
8.4refemits
8.4.1父组件操作子组件
8.4.2子组件通知父组件
8.5爷孙组件通信
8.6provideinject
8.6.1发起 provide
8.6.2接收 inject
8.7兄弟组件通信
8.8全局组件通信
8.9EventBus
8.9.1回顾 Vue 2的EventBus
8.9.2了解 Vue 3的EventBus
8.9.3创建 Vue 3的 EventBus
8.9.4创建和移除侦听事件
8.9.5调用侦听事件
8.9.6旧项目升级 EventBus
8.10Reactive State
8.10.1创建状态中心
8.10.2设定状态更新逻辑
8.10.3观察全局状态变化
8.11Vuex
8.11.1在了解之前
8.11.2Vuex的目录结构
8.11.3回顾Vue 2的Vuex
8.11.4了解 Vue 3的Vuex
8.11.5Vuex的配置
8.12Pinia
第9章 全局状态管理
9.1关于 Pinia
9.2安装和启用
9.3状态树的结构
9.4创建 Store
9.4.1形式1:接收两个参数
9.4.2形式2:接收一个参数
9.5管理 state
9.5.1给 Store 添加 state
9.5.2手动指定数据类型
9.5.3获取和更新 state
9.5.4批量更新 state
9.5.5全量更新 state
9.5.6重置 state
9.5.7订阅 state
9.6管理 getters
9.6.1给 Store 添加 getter
9.6.2获取和更新 getter
9.7管理 actions
9.7.1给 Store 添加 action
9.7.2调用 action
9.8添加多个 Store
9.8.1目录结构建议
9.8.2在 Vue 组件TypeScript文件里使用
9.8.3Store 之间互相引用
9.9专属插件的使用
9.9.1如何查找插件
9.9.2如何使用插件
第10章 高效开发
10.1script-setup
10.1.1新特性的产生背景
10.1.2全局编译器宏
10.1.3template 操作简化
10.1.4props接收方式的变化
10.1.5emits接收方式的变化
10.1.6attrs接收方式的变化
10.1.7slots接收方式的变化
10.1.8ref通信方式的变化
10.1.9很好await的支持
10.2命名技巧
10.2.1文件命名技巧
10.2.2代码命名技巧
附录 本书涉及的部分官方网站和文档的地址
内容摘要
本书以Vue.js的3.0版本为核心技术栈,围绕“前端工程化”和TypeScript的知识点展开讲解,根据笔者多年的前端开发和一线团队管理经验,将Vue 3的知识点按照工程师做项目的实施顺序梳理成章,一步一步帮助读者进行前端工程化和Vue 3的开发。从前端工程化开始到TypeScript语言的学习,
— 没有更多了 —
以下为对购买帮助不大的评价