![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端杂记
文章平均质量分 55
Qq@
程序员
展开
-
React 18带来的新变化
React 18带来的新变化简介 2022年3月,react正式发布v18,在带来很多新特性的同时,也废弃了在ie上的兼容性,如果想在ie上继续使用,建议依然使用18以下版本。 本文将对react18的新特性做概述。以及如何升级到react18版本做简单描述,或者可以去官网查看。架构概述 react18无疑将Concurrent模式从unstable变更为stable模式,在使用createRoot即可实现基于fiber架构下的异步、可中断、可恢复渲染模式,无疑提高了浏览器渲染效率。大原创 2022-05-31 19:02:50 · 672 阅读 · 0 评论 -
洋葱圈模型
介绍这个概念因koa框架兴起被熟知。利用generator函数(当时es8还没出,没法用async),实现中间件像洋葱圈一样执行的机制,实现后置处理逻辑。[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-38g9Wnjs-1652854006150)(/Users/yang/Downloads/68747470733a2f2f7261772e6769746875622e636f6d2f66656e676d6b322f6b6f612d67756964652f6d61737465原创 2022-05-18 14:07:07 · 503 阅读 · 0 评论 -
ts-classes
ts-classesclass members(类成员)Fieldsclass OKGreeter { // Not initialized, but no error name!: string;}readonlyclass Test { readonly name: string = "hello"; constructor() { this.name = 'hello too'; }}ConstructorsClass 的construc原创 2022-05-18 14:06:28 · 263 阅读 · 0 评论 -
ts -type alias 和interface的区别
ts -type alias 和interface的区别1、继承方式interface继承interface Animal { name: string}interface Bear extends Animal { honey: boolean}const bear = getBear() bear.namebear.honeyType alias继承type Animal = { name: string}type Bear = Animal & {原创 2022-05-18 14:05:57 · 260 阅读 · 0 评论 -
ts-Type Manipulation(类型操作)
ts-Type Manipulation(类型操作)1、Generics(泛型)- Types which take parameters泛型typefunction identity<Type>(arg: Type): Type { return arg;} let myIdentity: <Type>(arg: Type) => Type = identity;interface GenericIdentityFn { <Type>(ar原创 2022-05-18 14:05:16 · 127 阅读 · 0 评论 -
ts-Utility Types(高级类型)
ts-Utility Types(高级类型)Partial将泛型传入的T中所有属性转换为可选属性,返回的类型可以是T的任意子集。// 源码type Partial<T> = { [P in keyof T]?: T[P];};Required 将泛型传入的T中所有属性转换为必须属性,和Partial类型相反。type Required<T> = { [P in keyof T]-?: T[P];};Readonly将泛型传入的T中所原创 2022-05-18 14:04:33 · 190 阅读 · 0 评论 -
umi/father--build模块源码阅读
umi/father–build模块源码阅读背景 最近在做前端公共组件库的打包工具,B站上看到阿里大佬云谦做的一个关于前端组件库打包工具umi/father视频,于是拿来阅读,方便后期自己基于Rollup开发打包工具。项目架构 该项目同样是以lerna为monorepo架构的多包管理,共有2个包,father和father-build。father主要是处理组件库文档类,father-build是聚焦于利用rollup去打包library。本文重点关注father-build。主要模块解原创 2022-05-18 14:04:05 · 1983 阅读 · 0 评论 -
ts--映射类型
ts–映射类型(Mapped Types)1、介绍官网是这么说的When you don’t want to repeat yourself, sometimes a type needs to be based on another type.大意就是基于type提前创建的type,被后面的type消费。这样可以避免很多重复工作。// 定义基本typetype OptionsFlags<Type> = { [Property in keyof Type]: boolean;原创 2022-05-18 14:02:58 · 705 阅读 · 0 评论 -
Nodejs常用命令
Nodejs常用命令process模块// [node执行路径,文件执行目录,...args参数]process.argv// 当前Node.js进程执行时的工作目录process.cwd()fs模块existsSync// 同步判断是否存在该目录或文件existsSync(path.join(cwd, 'package.json'))readFileSync// 同步读取文件,不带回调函数// 读取项目package.json文件const pkgPath = join(c原创 2022-01-03 18:31:14 · 867 阅读 · 0 评论 -
Nodejs常用包及其作用
Nodejs常用包及其作用yargs-parser// 把命令行参数转换为json对象,方便访问/*{ _: [node路径,执行js文件目录,...args], // 带“-”的参数 如: -v 2.3.0 v: 2.3.0}*/yParser(process.argv.slice(2));update-notifier// Notify update when process exits// 程序退出时通知const updater = require('update-no原创 2022-01-03 18:30:26 · 698 阅读 · 0 评论 -
Babel常见配置及插件
Babel常见配置及插件常用配置@babel/preset-typescriptts预设插件,使用ts必装// 配置{ "presets": [ "@babel/preset-typescript" ]}@babel/preset-envjs预设插件,可以使用高版本js语法而不需要单独转换,根据babel和corejs polyfill语法映射进行转换// 配置{ "presets": [ [ "@babel/preset-env",原创 2022-01-03 18:29:52 · 3871 阅读 · 0 评论 -
Rollup常用配置及插件
常用配置input// 入口文件input: 'bundle.js'output// 打包配置// format: amd, cjs, es, iife, umd, system// dir 打包输出目录// entryFileNames entry-[name].js 动态打包// sourcemap // file ${name}.umd`}.js// globals 定义全局变量命名plugins[ url(), // xxx..]external//原创 2022-01-03 18:28:27 · 4053 阅读 · 0 评论