地基预处理器：预处理器是一种在代码编译或转换之前处理代码的工具，主要用于扩展原生语言的功能，使开发者可以使用更高级的语法

预处理器和后处理器

预处理器：预处理器是一种在代码编译或转换之前处理代码的工具，主要用于扩展原生语言的功能，使开发者可以使用更高级的语法和特性。常见的预处理器包括 CSS 预处理器（如 Sass、Less、Stylus）和 HTML 预处理器（如 Pug）。
- 功能：
  - 增强语法：支持变量、嵌套、继承等
  - 代码复用：允许定义可重用的代码片段：混合mixin和函数等
  - 模块化：支持将代码分割成多个文件，并通过导入机制进行组合
  - 自动化处理：预处理器可以自动处理一些重复性工作，如自动添加浏览器前缀、转换单位等，减轻开发者的工作量。
后处理器：一种在代码编译或转换之后处理代码的工具，主要用于优化和增强生成的代码
- 功能：
  - 自动添加浏览器前缀：根据目标浏览器的兼容性要求，自动添加必要的浏览器前缀，确保样式在不同浏览器中的一致性。
  - 代码优化和压缩：后处理器可以对生成的代码进行优化和压缩，减少文件体积，提高页面加载速度
  - 代码转换：后处理器可以将一些新的 CSS 特性转换为兼容旧版浏览器的代码，确保代码的兼容性和可用性
  - 代码检查和修复：后处理器可以对生成的代码进行检查和修复，确保代码符合规范和最佳实践，减少潜在的错误和问题

typescript中interface和type的区别

描述对象
- interface：对象和函数
- type：可以描述任何类型：对象、基本类型、联合类型等
是否可以合并
- interface：多个同名interface自动合并
- type：不可合并，只能通过&合并不同的类型
扩展
- interface：使用implements进行扩展
- type：不支持

typescripe中的Pick

手写Pick

type Pick<T, K extends keyof T> = {
    [P in K]: T[P];
};

使用Pick可以大类型中挑选指定的类型

//从Todo中提取title和description作为新的类型
interface Todo { 
    title: string; 
    description: string; 
    completed: boolean; 
    createdAt: number; 
} 
// 使用 Pick 工具类型 
type TodoPreview = Pick<Todo, 'title' & 'description'>; 
// 示例 
const todo: TodoPreview = { 
    title: 'Learn TypeScript', 
    description: 'Understand utility types like Pick' 
};

webpack optimization

module.exports = { 
    // 其他配置项... 
    optimization: { 
        splitChunks: { 
            chunks: 'all', // 指定哪些模块会被拆分，默认值是 async，表示只会拆分异步加载的模块 
            minSize: 20000, // 模块最小大小，小于这个大小的模块不会被拆分，默认值是 30000 
            minChunks: 1, // 模块最少被引用的次数，只有被引用次数大于等于这个值的模块才会被拆分，默认值是 1 
            maxAsyncRequests: 5, // 按需加载的模块最大并行请求数，默认值是 5 
            maxInitialRequests: 3, // 初始加载时的模块最大并行请求数，默认值是 3
            automaticNameDelimiter: '~', // 自动命名生成的文件名中，不同部分之间的分隔符，默认值是 ~
            name: true, // 启用自动命名，默认值是 true
            cacheGroups: { 
                vendors: { 
                    test: /[\/]node_modules[\/]/, // 匹配需要拆分的模块路径的正则表达式 
                    priority: -10, // 缓存组的优先级，数值越大，优先级越高，默认值是 0 
                    filename: 'vendors.js' // 拆分出来的文件名 
                }, 
                default: { 
                    minChunks: 2, // 默认缓存组的模块最少被引用的次数，默认值是 2 
                    priority: -20, // 默认缓存组的优先级，默认值是 -20 
                    reuseExistingChunk: true // 允许复用已经存在的 chunk，默认值是 true 
                } 
            } 
    } 
} };

package.json

scripts：脚本内容
dependencies：运行项目所需的依赖
devDependencies：开发项目所需的依赖
resolutions：yarn特有，强制指定项目的依赖树中某个包的特定版本
main：项目入口文件