- 博客(17)
- 资源 (3)
- 问答 (2)
- 收藏
- 关注
RSS订阅原创 日常错误整理
DOMException: Failed to execute 'setItem' on 'Storage': Setting the value of 'widgetCacheData' exceeded the quota.在使用sessionStorage做缓存处理时，报了如上的错误提示，经查是sessionStorage对大小是有限制的，所以要进行try catch，500KB左右的东西保存起来就会令到Resources变卡，2M左右就可以令到Resources卡死，操作不了，5M就到了Chro
2021-05-12 13:51:47
3132
1
原创 webpack5.0配置 填坑记
HtmlWebpackPlugin 在配置时需要特别注意 template属性的配置，建议使用默认配置，可以在filename配置时更改index.html文件的存放位置 webpack5.0中会自动生成 .LICENSE.txt后缀的文件，但是这个文件对我们来说其实是没什么意义的。如下图：是因为 Webpack 5.0 默认压缩代码工具为terser-webpack-plugin，该工具默认会生成 LICENSE.txt 文件。解决：npm install terser-webpack-plu
2021-03-25 11:49:56
593
原创 webpack5.0 + React17.0从零开始构建项目（持续更新中）
准备工作前端开发node环境是必不可少的，如果你还没安装node环境，请先安装node，最新稳定版本。安装教程自行百度(PS: 一搜一大把)两大必备利器：webpack:本质上，是一个用于现代 JavaScript 应用程序的_静态模块打包工具_。当 webpack 处理应用程序时，它会在内部构建一个依赖图(dependency graph)，此依赖图对应映射到项目所需的每个模块，并生成一个或多个bundle。 babel: 是一个javaScript编译器。是一个工具链，主要用于将...
2021-03-22 23:15:08
959
原创 webpack 打包、配置优化
tree shaking （webpack V4.0之后 mode为produciton时 默认支持）Tree Shaking的含义是把一个模块里没用的东西都摇晃掉。一个模块可以理解为一个文件，例如a.js，里面会导出很多内容，当我们去引入这个树的一部分，那么引用的部分做打包，不引入的部分剔除掉，这就是tree shaking概念。注意：Tree Shaking只支持ES Moudule的引入，也就是支持import模块的引入，如果使用const add = require('./a.js)这种
2021-03-20 19:40:35
162
原创 webpack深入探讨
css自动补齐前缀使用postCss插件的autoprefixer 的自动补全，根据can I use 规则// 建议 mini-css-extract-plugin 与 css-loader 一起使用, 该插件与style-loaader互斥module.exports = { entry: { app: './src/app.js', home: './src/index.js' }, output: { file..
2021-03-20 15:31:04
113
原创 webpack认知(学习笔记)
首先webpack是现阶段前端广为流传的一个打包工具！webpack认为一切都是模块！话不多说，放图：那么，既然是打包，总的先知道从哪开始也就是入口，即配置项 entry，有入口就有出口，即配置项 output而对于非代码的东东。比如说图片，字体等webpack也会将其根据依赖关系不断的加入到依赖树中，进行打包。entry的用法1. 单入口：entry是一个字符串（单页应用）module.exports = { entry: './src/index.js'}
2021-03-18 21:43:33
310
原创 记一次canvas拖拽和grid-layout组件拖拽事件冲突的问题
在 grid-item 上添加 dragIgnoreFrom="canvas" 可以阻止在canvas上的拖拽冒泡到外层grid-item组件上
2021-03-18 17:01:57
553
1
原创 javaScript零散知识点
js事件循环async function async1() { console.log('async1 start'); await async2(); console.log('async1 end');}async function async2() { console.log('async2');}console.log('script start');setTimeout(function() { console.log('setTimeo
2021-03-09 17:22:01
77
原创 javaScript零散知识点
真的了解this吗function foo() { var a = 2; this.bar();}function bar() { console.log( this.a );}foo(); // ReferenceError: a is not defined上述这段经典错误代码，试图通过 this.bar() 来引用 bar() 函数。这是绝对不可能成功的。那么this到底是什么呢？首先要明白this是在运行时绑定的，其次this 的绑定和函数声明的位置
2021-03-09 15:47:25
72
原创 javaScript零散知识点
js作用域在 JavaScript 中，我们将作用域定义为一套规则，这套规则用来管理引擎如何在当前作用域以及嵌套子作用域中根据标识符名称进行变量（变量名或者函数名）查找。js中只有全局作用域和函数作用域。作用域和执行上下文是两个完全不同的概念。js代码的整个执行过程分为编译阶段和执行阶段，而在编译阶段就会确定作用域，执行上下文则是在执行阶段创建。作用域链，是由当前环境与上层环境的一系列变量对象组成，它保证了当前执行环境对符合访问权限的变量和函数的有序访问。...
2021-03-08 22:33:42
124
原创 javaScript零散知识点
js内存js是在创建变量时 自动进行了分配内存，并且在不使用它们时 自动 释放。释放的过程称为垃圾回收。内存生命周期：1. 分配你所需要的内存；2. 使用分配到的内存（读，写）；3. 不需要时将其释放/归还。数据结构栈：后进先出； 队列：先进先出； 堆：树状结构，类似于key-value键值对的存储方式。js中并没有严格意义上区分栈内存和堆内存。一般情况下基础类型的数据，在栈内存中维护，引用类型的数据在堆内存中进行维护。基本类型的数据在内存中存储的是值...
2021-03-08 17:14:00
84
原创 javaScript零散知识点
String类 （js万物皆对象）string大家都很熟悉了吧，定义一个字符串变量，都会写 :var str = "abc";事实上，我们在代码中这么写的背后，js已经自动的帮我们做了一系列的处理，那么上述字符串变量定义的完整写法，实际上这样的：var str = new String("abc");很直观的可以看到，我们new了一个String的实例，那么在浏览器控制台输出就会看到这样子的东西。可以看到，字符串类型string继承了字符串类String的所有属性，(好比人属
2021-03-06 21:11:54
115
原创 javaScript零散知识点
js原型你真的知道吗最开始学习js的时候也学过原型，但是当时感触就是这东西也就那样(内心os：什么鬼)。现在回想，真的彻彻底底的掌握了原型了吗？说到js继承，那是肯定绕不开原型的，那什么是原型呢？MDN是这么描述的：js只有一种结构，对象。（ps:也就是我们常听说的一句话：万物皆对象）每个实例对象都有一个私有属性(__proto__)，指向它的构造函数的原型对象(prototype)。该原型对象也有一个自己的原型对象(__proto__)，层层向上直到一个对象的原型对象为null。规定：nul
2021-03-06 20:33:02
80
原创 javaScript零散知识点
js类型转换偶然在网上看到张很有意思的图，输出结果可能很多人意想不到。（图就不放了直接看控制台输出吧，哈哈哈！）// 在控制台输入左边代码 可得到右边值typeof NaN // number9999999999999999 // 100000000000000000.5 + 0.1 === 0.6 // true0.2 + 0.1 == 0.
2021-03-03 22:50:01
150
1
原创 javaScript零散知识点
js 数据类型判断1. typeoftypeof('') // stringtypeof(2) // numbertypeof(false) // booleantypeof(Symbol()) // symboltypeof(BigInt(2)) // biginttypeof(undefined) // undefinedtypeof(null) // objecttyp
2021-03-03 18:04:28
114
2
原创 javaScript零散知识点
你不知道的csscss，每个前端人的基本技能，或一般或熟练或精通！这里我们就来聊聊那些 你或许不知道的css。PS：不定时补充更新。1.flex布局会影响到overflow2.table 不支持设置 box-shadow3. 以下三种情况会导致position: fixed定位错位： (1)transform 属性值不为 none 的元素; (2).perspective 值不为 none 的元素; (3)在 will-change 中指定了任意 ...
2021-03-03 08:31:20
109
原创 javaScript零散知识点
js 初步认知1.js是一种具有函数优先的轻量级，解释型或即时编译型的弱类型编程语言。2. js由ECMAScript，BOM，DOM 三部分组成。其中ECMAScript是核心，规定了语言的书写规范，BOM提供于浏览器交互的接口和方法，DOM提供访问网页内容的方法和接口。...
2021-03-03 08:26:11
107
webpack打包运行过程中报错
2021-04-27
webpack5.0使用HtmlWebpackPlugin在配置template时会报错
2021-03-24
TA创建的收藏夹 TA关注的收藏夹
TA关注的人