![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端工具
文章平均质量分 74
葡萄糖o_o
一个热爱前端技术的群众。
展开
-
HTTP的那些事儿
摘要算法可以将任意长度的数据压缩成定长,并且摘要算法具有雪崩效应,对于原文的一点改动生成的摘要则完全不同,同时摘要算法生成的摘要不可逆。我们可以通过摘要算法生产原始数据的摘要附上原始数据一起发送给对方,这样如果被修改过,那么肯定和摘要是对不上的。当然通信必须要建立在机密性之上,否则连原文和摘要一起改那也就束手无策了。到这里完整性和机密性都具备了,还差身份认证和不可否认。原创 2023-04-02 22:53:12 · 1247 阅读 · 0 评论 -
react和vue在响应式上的不同理解
在vue中数据是可变的,而副作用监听数据的变化。所以在vue中props中的数据是可以被改的,并且vue本身还能够支持props数据变化之后的响应。vue的响应以数据源中心向外辐射,换句话说只要数据改了vue就能响应变化,无论这个数据是在什么地方改的。react实现响应的方法是,需要对比两次数据是否相同,修改前和修改后数据相同则不更新组件,否则触发响应,更新整个组件,包括子组件。vue实现响应的方法是,首先收集依赖这个数据的副作用(视图更新、计算属性等),当数据修改时统一调用依赖这个数据的副作用完成响应。原创 2023-03-06 12:54:50 · 840 阅读 · 0 评论 -
读vue【深入响应式系统】后整理
一直以来对vue的依赖自动追踪的原理很感兴趣,像魔法一样。对于交给vue的对象返回后,在哪里使用了这个返回的对象vue会自动追踪,等这个对象改变时vue会自动通知到之前使用改变量的方法,整个过程和react很不一样,react的useEffect需要用户手动声明依赖而vue不同。这篇官方文档通俗易懂的介绍了vue的响应式原理,对文档中省略的部分补充后,文档中代码可以正常运行。阅读完文章后对其进行解释。当点击页面时会触发属性的修改,属性a修改后会自动通知到重新执行。原创 2022-12-16 10:27:31 · 234 阅读 · 0 评论 -
package-lock.json
package.json确定依赖的范围,package-lock.json将这个范围精确到具体版本。主要是为了解决在各个环境中得到确定的node_modules,如果只依赖package.json因为该文件声明的是直接依赖的范围,它无法将直接依赖固定在某个特定版本,也无法声明依赖的依赖。所以需要引入package-lock.json文件来达到我们固定node_modules的目的。。npm7之后的版本生成的package-lock是可信的。...原创 2022-05-15 21:41:28 · 12064 阅读 · 2 评论 -
webpack联邦模块之consumes方法
对于使用联邦模块的项目会有两个依赖,一个是远程模块,一个是共享模块。上一篇文章解释了远程模块的加载和安装并初始化共享作用域。consumes则是共享模块的解决方案,用于在运行时加载并安装依赖的共享模块。为什么叫consumes?我理解是因为共享模块的获取是在__webpack_require__.I中完成的,而consumes只是使用__webpack_require__.S中的数据来安装对应模块。所以consumes是在消费__webpack_require__.S中的数据。__webpack_req原创 2022-04-10 20:21:21 · 1240 阅读 · 0 评论 -
webpack联邦模块之remotes方法
使用联邦模块后当前项目就会有两个依赖,一个是依赖共享模块,一个是依赖远程模块。运行时webpack/runtime/consumes用于解析共享模块,运行时webpack/runtime/remotes 用于解析远程模块。这两个模块对应的方法分别是__webpack_require__.f.consumes ****和__webpack_require__.f.remotes,是的这两个方法都是关在__webpack_require__.f上的,和上一篇文章中的__webpack_require__.f.j原创 2022-04-10 16:04:34 · 2029 阅读 · 0 评论 -
webpack联邦模块之webpack运行时
webpack是如何打包ES模块的?webpack是如何构建自身的模块运行时的?__webpack_require__这是整个webpack运行时的核心。该函数被用于根据模块Id从变量__webpack_module_cache__获取模块对应导出:有,直接返回没有,去__webpack_modules__上找到模块id对应的模块,获取对应模块导出。所以可以看出来__webpack_require__方法不用管模块具体是怎么来的。该方法调用的时候,调用方需要确保该模块id对应的模块已经存在原创 2022-04-02 16:29:50 · 2074 阅读 · 0 评论 -
ESLint共享配置的两种方式eslint-plugin和eslint-config
使用ESLint很久了,也看了ESLint官方文档很多遍,但对于ESLint配置的规则还是不胜清楚,例如:{ "extends": ["plugin:prettier/recommended"]}上面extends的值为什么要"plugin:"开头?这里的prettier插件需要显示安装吗?像这样plugins: ["prettier"]。{ "plugins": ["prettier"], "rules": { "prettier/prettier": "error" }原创 2021-02-17 13:09:03 · 3426 阅读 · 6 评论 -
代码风格之Prettier简介
多人协作中统一的代码风格有利于项目的发展这是共识,但是采用什么标准来统一代码这选择就相对纷杂。项目刚开始使用了ESLint来规范代码,但是ESLint默认是支持JavaScript,加上配置可以支持TypeScript,而样式的支持则需要再配置StyleLint,所以后面在项目中引入了Prettier这个统一的方案。因为最开始使用的ESLint的standard来规范JavaScript和TypeScript代码所以切换到Prettier的时候不方便做大的改动,所以Prettier的采用目的是规范Java原创 2020-09-28 11:31:37 · 886 阅读 · 0 评论 -
阅读react-redux源码 - 一
阅读react-redux源码零中准备了一些react、redux和react-redux的基础知识。从使用的例子中可以看出来顶层的代码中需要用一个来自react-redux的Provider组件提供redux的store,然后Provider的后代组件通过connect组件连接自己的业务组件就可以获取到通过Provider组件跨组件传递过来的store中的state值。所以我们先从Provider开始看源码的实现。因为源码很短,直接先贴出来整个源码如下:import React, { useMemo,原创 2020-06-20 23:12:18 · 316 阅读 · 0 评论 -
wbepack中output.filename和output.chunkFilename
chunkFilename的规则会作用于entry字段提供的文件。而entry字段提供的文件应该是应用的入口,并不应该被chunkFilename所影响才对,但是确实被chunkFilename影响了。这其实是我们对于webpack配置文件中的entry字段和整个应用入口文件理解不完善导致的。原创 2020-02-07 22:11:53 · 1732 阅读 · 0 评论 -
记录一次cookie导致登录失败的惨案
现象描述:前端登录成功后并没有从后端那里拿到登录信息,换句话说登录服务告诉我们登录成功了,但是后端却说我们没有登录成功。背景:因为前后端分离,所以前后端项目部署在两个子域名下。因为要打通登录态,需要调用登录服务,登录服务会在 .baidu.com 下写入登录态。前端域名:xxx.baidu.com后端域名:yyy.baidu.com原因:后端拿到的登录态和登录服务下发的登录态不统一...原创 2019-09-28 16:12:10 · 1174 阅读 · 0 评论 -
babel6和babel7中关于polyfill和preset-env和babel-plugin-transform-runtime等总结
记录自己零散的收获,随笔。一些基础babel的作用是转换新特性为大部分浏览器能支持的代码。babel转码又分为两部分,一个是语法转换,一个是新API转换。而对于API的转换又分为两部分,一个是可私有的API,一个全局对象的实例(Array.prototype.includes之类的方法)和Object.assign之类的静态方法。我们又知道babel代码转换又依赖plugin,没有plu...原创 2019-09-11 00:07:36 · 3701 阅读 · 0 评论