Vue秘籍：如何动态修改页面 Title（浏览器页签名称）？在开发Vue项目时，我们经常需要根据不同的页面动态修改浏览器的页签标题（ title ），比如： 在电商网站中，展示商品详情时，标题应该是 商品名称 - 商城名称 。 在后台管理系统中，切换不同的页面时，页签名称应随之变化。 在聊天应用中，当有新消息时，页签标题可以变成**（1）新消息 - ChatApp**，吸引用户注意。 那

Vue 3 的 v-memo：高效的渲染优化利器在日常的Vue项目开发中，我们经常会遇到这样的情况：父组件更新了，但子组件明明没有用到相关数据，却也跟着无意义地重新渲染。这不仅浪费性能，还可能导致页面卡顿。 Vue 3 在 3.2 版本 引入了一个新的指令 —— v-memo ，它的作用就是帮助我们 跳过不必要的渲染 ，让应用运行得更加丝滑。 本文将从概念、场景、示例、性能对比，再到和大家熟悉的

介绍本章节我们主要学习： loader 原理 自定义常用 loader plugin 原理 自定义常用 plugin Loader 原理loader 概念帮助 webpack 将不同类型的文件转换为 webpack 可识别的模块。 loader 执行顺序 分类 pre： 前置 loader normal： 普通 loader inline： 内联 loader post： 后置 loade

介绍我们将使用前面所学的知识来从零开始搭建 React-Cli 和 Vue-cli。 React 脚手架开发模式配置1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757

基本使用Webpack 是一个静态资源打包工具。 它会以一个或多个文件作为打包的入口，将我们整个项目所有文件编译组合成一个或多个文件输出出去。 输出的文件就是编译好的文件，就可以在浏览器段运行了。 我们将 Webpack 输出的文件叫做 bundle。 功能介绍Webpack 本身功能是有限的: 开发模式：仅能编译 JS 中的 ES Module 语法 生产模式：能编译 JS 中的 ES Mod

介绍本章节主要介绍 Webpack 高级配置。 所谓高级配置其实就是进行 Webpack 优化，让我们代码在编译/运行时性能更好~ 我们会从以下角度来进行优化： 提升开发体验 提升打包构建速度 减少代码体积 优化代码运行性能 提升开发体验SourceMap为什么开发时我们运行的代码是经过 webpack 编译后的，例如下面这个样子： 1234567891011121314151617

1. Vue3新组件1.1. 【Teleport】 什么是Teleport？—— Teleport 是一种能够将我们的组件html结构移动到指定位置的技术。 1234567<teleport to='body' > <div class="modal" v-show="isShow"> <h

1. 其它 API1.1.【shallowRef 与 shallowReactive 】shallowRef 作用：创建一个响应式数据，但只对顶层属性进行响应式处理。 用法： 1let myVar = shallowRef(initialValue); 特点：只跟踪引用值的变化，不关心值内部的属性变化。 shallowReactive 作用：创建一个浅层响应式对象，只会使对象的最顶层属性变

1. 组件通信Vue3组件通信和Vue2的区别： 移出事件总线，使用mitt代替。 vuex换成了pinia。 把.sync优化到了v-model里面了。 把$listeners所有的东西，合并到$attrs中了。 $children被砍掉了。 常见搭配形式： 1.1. 【props】概述：props是使用频率最高的一种通信方式，常用与 ：父 ↔ 子。 若 父传子：属性值是非函数。

1. pinia1.1【准备一个效果】 1.2【搭建 pinia 环境】第一步：npm install pinia 第二步：操作src/main.ts 12345678910111213import { createApp } from 'vue'import App from './App.vue'/* 引入createPinia，