Webpack原理分析
介绍本章节我们主要学习： loader 原理 自定义常用 loader plugin 原理 自定义常用 plugin Loader 原理loader 概念帮助 webpack 将不同类型的文件转换为 webpack 可识别的模块。 loader 执行顺序 分类 pre： 前置 loader normal： 普通 loader inline： 内联 loader post： 后置 loade
Webpack项目配置
介绍我们将使用前面所学的知识来从零开始搭建 React-Cli 和 Vue-cli。 React 脚手架开发模式配置1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757
Webpack基础配置
基本使用Webpack 是一个静态资源打包工具。 它会以一个或多个文件作为打包的入口，将我们整个项目所有文件编译组合成一个或多个文件输出出去。 输出的文件就是编译好的文件，就可以在浏览器段运行了。 我们将 Webpack 输出的文件叫做 bundle。 功能介绍Webpack 本身功能是有限的: 开发模式：仅能编译 JS 中的 ES Module 语法 生产模式：能编译 JS 中的 ES Mod
Webpack高级优化
介绍本章节主要介绍 Webpack 高级配置。 所谓高级配置其实就是进行 Webpack 优化，让我们代码在编译/运行时性能更好~ 我们会从以下角度来进行优化： 提升开发体验 提升打包构建速度 减少代码体积 优化代码运行性能 提升开发体验SourceMap为什么开发时我们运行的代码是经过 webpack 编译后的，例如下面这个样子： 1234567891011121314151617
Vue3新组件
1. Vue3新组件1.1. 【Teleport】 什么是Teleport？—— Teleport 是一种能够将我们的组件html结构移动到指定位置的技术。 1234567<teleport to='body' > <div class="modal" v-show="isShow"> <h
Vue3其它API
1. 其它 API1.1.【shallowRef 与 shallowReactive 】shallowRef 作用：创建一个响应式数据，但只对顶层属性进行响应式处理。 用法： 1let myVar = shallowRef(initialValue); 特点：只跟踪引用值的变化，不关心值内部的属性变化。 shallowReactive 作用：创建一个浅层响应式对象，只会使对象的最顶层属性变
Vue3组件通信
1. 组件通信Vue3组件通信和Vue2的区别： 移出事件总线，使用mitt代替。 vuex换成了pinia。 把.sync优化到了v-model里面了。 把$listeners所有的东西，合并到$attrs中了。 $children被砍掉了。 常见搭配形式： 1.1. 【props】概述：props是使用频率最高的一种通信方式，常用与 ：父 ↔ 子。 若 父传子：属性值是非函数。
Vue3Pinia
1. pinia1.1【准备一个效果】 1.2【搭建 pinia 环境】第一步：npm install pinia 第二步：操作src/main.ts 12345678910111213import { createApp } from 'vue'import App from './App.vue'/* 引入createPinia，