- 博客(45)
- 收藏
- 关注
RSS订阅原创 【前端笔记】Vue项目报错Error: Cannot find module ‘webpack/lib/RuleSet‘
网上搜了下发现原因不止一种，这里仅记录本人遇到的原因和解决办法，仅供参考。再次提示，这是本人遇到的，可能和大家有所不同，勿杠。
2024-05-22 15:34:17
84
原创 【前端笔记】记录一个能优化Echarts Geo JSON大小的网站
我这个是拿的已经优化过的中国地图的Geo JSON数据，这里可以看到整整齐齐排列的34个方块，具体含义不需要知道太详细，只需要知道是代表着检测出来的区域数量（这里代表着这份地图数据有34个区域）前端在使用Echarts等可视化图表库会不可避免遇到的问题，渲染地图的数据太大。接着，选择一个Geo JSON文件（或者页面上提示的所支持的文件都可）。关于优化的大小，我拿已经优化过的数据举例，优化前：96KB —> 优化后：6KB（仅供参考）如图，如果我们需要在Echarts中使用，可以选择最后2个导出并使用。
2024-05-22 15:04:19
184
原创 【前端笔记】ant-design-vue 3.x使用modal.method()自定义content内容小记
在一次编写业务代码时，碰到了一种既想要样式，有想要定制其content内容的情况。大部分情况下，使用这种方式时，可能content内容固定都是字符串，那如果想要做更高级的交互怎么办？文档里已经有了答案可以看到content是可以接收VNode的，所以一种简单的解决思路就有了。下面用我自己的实践作demo，是一个弹窗后复制的功能。
2023-11-03 16:19:57
790
原创 【前端笔记】npm报错ERR_OSSL_EVP_UNSUPPORTED
原因是node v17中的OpenSSL3.0对允许算法和密钥大小增加了严格的限制。既然是版本问题，最简单粗暴的办法就是降级。然后重新启动项目，就不会失败了。
2023-07-25 15:59:35
3150
原创 【前端笔记】indexDB使用简单介绍
IndexedDB 是一种底层 API，用于在客户端存储大量的结构化数据（也包括文件/二进制大型对象（blobs））。该 API 使用索引实现对数据的高性能搜索。虽然 Web Storage 在存储较少量的数据很有用，但对于存储更大量的结构化数据来说力不从心。而 IndexedDB 提供了这种场景的解决方案。本页面 MDN IndexedDB 的主要引导页 - 这里，我们提供了完整的 API 参考和使用指南，浏览器支持细节，以及关键概念的一些解释的链接。——MDN。
2023-07-02 14:23:53
1935
原创 【前端笔记】如何更新项目依赖
Node 软件包管理器（NPM）提供了各种功能来帮助你安装和维护项目的依赖关系。由于错误修复、新功能和其他更新，依赖关系可能会随着时间的推移而变得过时。你的项目依赖越多，就越难跟上这些更新。有时，新的软件包并不一定会对旧项目造成破坏性影响，可能还会对项目的性能带来不错的提升或者体验。因此，定期检查项目的依赖和更新依赖也是挺重要的。
2023-06-26 11:29:36
2040
原创 Echarts实现伪3D地图 + 自定义标准的实现小记
仅作为记录，欢迎参考，不喜勿喷<template> <v-chart :option="option" autoresize></v-chart></template><script>import { mapState } from 'vuex';import { use, registerMap } from 'echarts/core';import { MapChart, EffectScatterChart } fro
2023-05-05 11:19:16
831
原创 【cocos笔记】3.7版本2d碰撞检测小记
目前cocos createor最新版本为3.7，但是网上的大部分教程都是2.x的，所以还是有些区别，特地记录一下。
2023-03-25 12:26:39
639
3
原创 【前端笔记】简单记录一个修改图片颜色的办法
当遇到像菜单栏这样的场景，激活前图片和文字是默认样式，激活后图片要和文字一样有激活后的颜色，那么图片的颜色要怎么改呢。3、完成，目前感觉最简单的方式就是这个（兼容？IE都死了还兼容，实在要兼容就整2张图片吧），张旭鑫大佬写的一个颜色转换工具。2、使用转换后得到的代码。
2023-01-14 15:14:51
422
原创 【cocos笔记】记录一次实现ScrollView滚动加载的过程
这样当数据量大时就可以滚动了。当然这仅限数据量小的情况，如果要展示是数据量很大，不可能一次性请求几百条然后硬塞到。当要显示多条数据时，一般会使用滚动视图组件。学习笔记，新人入坑，欢迎指点。中，那么滚动加载是不可避免的。
2022-11-26 22:23:13
1645
原创 【前端笔记】Vue + Element UI开发小技巧，持续更新。。。
这块是根据自己实际情况分享的，可能有人觉得不会碰到这种奇怪需求，也可能有人会说：要动态值不放在meta中放路由上呗等等。适合场景：不能提前定义好值进行使用的情况（比如自己情况就是详情页封装的面包屑需要动态变更header的名称）在编写组件时，不可避免的要根据需要传递各种值给组件，如果一个个的绑定传递就会显得很麻烦。可能有部分人会碰到一种需求是根据页面动态修改标题，普遍的方案是在router的meta配置中新增。因为element的。只能监听到浅层（也就是第一层）数据，无法做到监听其属性内属性的变化（设置。
2022-11-04 10:49:34
302
原创 npm本地发包过程
这个命令，并不会在npm上里撤销已有的包，但会在任何人尝试安装这个包的时候得到deprecated的警告。如果是自行测试上传的包，可以使用上面的方式，如果是发布给别人用的，建议用此命令。如果发布的包只打算放在公司的私有镜像库中，需要先设置一下。发布包后需要验证的话，可以使用下面的命令。登录后进入到要发布包的项目根目录。
2022-10-28 11:18:03
1025
原创 【前端笔记】for...in和for...for的区别
使用场景上：for…in用来迭代对象，for…of用来迭代数组。对象没有属性所以无法使用for…of，但是数组因为也是对象，所以可以使用for…in迭代过程上：for…in会迭代自身原型链上的可迭代属性和方法，for…of不会迭代结果上：for…in获取到的是键，for…of获取到的是值。
2022-09-24 12:09:20
451
原创 【前端笔记】手写Promise，跟着教学轻松理解Promise
/ 定义promise的状态 const PENDING = 'pending';// 接收一个函数作为参数 constructor(executor) {// 初始状态为pending this . status = PENDING;// new Promise后立即执行，接收2个参数 executor(resolve , reject);} // 获取结果的函数 then() {} }根据第二个示例我们可以看到p3中抛出错误也是被rejected。
2022-09-18 15:00:05
485
原创 【资源分享】Echarts中国地图、世界地图JSON数据（包括省市、经纬度、世界地图国家名称中英对照）
之前做数据可视化需求时需要用到中国地图和世界地图的数据，但苦于网上的资源参差不齐（谷歌和百度都一样），"历尽磨难"终于收集到了合适的资源，特地分享出来（毕竟CSDN很多免费资源居然要付费下载）因为直接资源分享会被ban，所以单开一贴分享GitHub上的地址，GitHub上不去的可以百度搜索下改host很轻松的。
2022-09-14 22:41:41
5283
8
原创 【前端面试题】实现一个EventEmitter
EventEmitter类似于Vue中的事件总线。接下来以Vue事件总线的方式进行解释，方便理解。函数接收2个参数，第一个参数是事件名称，第二个参数的执行的回调函数。函数接收2个参数，第一个参数是事件名称，第二个参数是要传递的参数。函数接收2个参数，第一个参数是事件名称，第二个参数的执行的回调。函数接收2个参数，第一个参数是事件名称，第二参数是要卸载的函数。首先，我们使用Class搭建起这个函数（普通函数也可以）函数监听到就会执行相应的回调函数。函数有了，接下来实现派发事件的。
2022-09-14 22:32:29
694
原创 【前端面试题】var、let、const的区别是什么
ES6之前只有全局作用域和函数作用域，函数作用域中通过var声明的变量不会挂载到window上，除非是没有使用var声明，浏览器就会自动在全局作用域下声明一个相同变量名称。
2022-09-11 18:08:20
142
原创 【前端面试题】劫持页面所有a标签，在跳转前进行操作
缺点是不是所有的事件都支持，而且如果页面dom层级嵌套过深，某一元素阻止了事件冒泡就会出现不可预知的问题。优点是不用给每个元素都绑定事件，而且无论是动态新增、删除的元素都可以绑定上事件，节省事件注册，节省内存。// 获取模板元素，只有点击的是a标签才劫持。只要能判断是a标签就行，这里用的localName。confirm返回一个布尔值，点了确定为true，否则为false。事件委托，就是将事件绑定绑定到其父元素上，由父元素触发。// 阻止默认事件，避免点击跳转。// 获取到a标签上的链接。
2022-09-10 16:11:57
662
原创 【前端面试题】补全函数，使其按顺序执行
根据以上代码，补齐fun和sleep函数，使得fun执行后打印结果为：start -> 1s后输出1 -> 2s后输出2 -> 3s后输出end。
2022-09-10 15:57:17
358
原创 【前端笔记】Vue2中路由history和hash模式的区别
在前端进行页面访问时，浏览器会发起http请求获取当前页面的资源。因为项目是通过路由跳转的，webpack帮忙处理了这种情况。但在生产环境中没有这些配置，当我们访问/xxxx/xxx时，浏览器会去请求下载这个url的资源，但是实际并不存在这个url的资源，所以就会出现404的现象。
2022-09-09 17:02:08
385
原创 【前端笔记】Cookie、LocalStorage、sessionStorage的区别
Cookie、LocalStorage、sessionStorage的区别
2022-09-09 17:00:41
136
原创 【前端笔记】什么是跨域，怎么解决跨域
由于浏览器的同源策略影响，当请求源与请求地址存在协议、域名、端口有任何一个不同时，就会引起跨域注意：跨域是浏览器引起的。
2022-09-09 16:58:34
215
原创 Element按需引入并且自动导入组件
项目开发时，为了减少打包体积，我们一般会进行各种优化，比如组件库的按需引入。因为很多情况下我们用到的可能就是表单组件和一些特殊情况需要的组件，全量引入是最不理想的情况。按需引入的话又需要我们手动注册要使用的组件，虽然可以使用循环等方法注册，但这也不是最好的方法。最理想的情况是，我们开发像全量引入时那样使用组件库组件，组件根据我们的使用自动按需引入并注册。就是能帮助我们做到这些事的插件。
2022-09-07 12:19:27
2073
14
原创 【学习笔记】简单模拟实现Call、Apply、Bind
使用方式和call一样，唯一区别就是除第一个改变this指向的参数外，apply的剩余作为一个数组整体传入。bind与call和apply的区别是bind回返回一个函数，执行该函数会修改this的指向。call，强制将this的指向修改为传入的第一个参数，剩余的参数将作为调用函数的参数传入。
2022-09-03 12:44:49
121
原创 【学习笔记】防抖与节流
一句话概况防抖就是将多次操作合并为一次操作。用代码的话来说就是：开启一个定时器，在规定时间内如果触发多次事件则清空定时器重新计时，否则才执行。节流类似于番剧，雷打不动的固定一周更新一集（大概）。...
2022-08-08 22:49:01
71
原创 【学习笔记】HTTP中的简单请求和复杂请求
复杂请求发出前会先发出一个OPTIONS请求，称为预检请求。预检请求的作用是将实际请求的一些内容发送给服务器，询问服务端是否接受。服务器接收到OPTIONS请求后会在响应头中告诉浏览器服务器当前允许接收的信息。注：当客户端要携带cookie时，origin的值必须为准确的url，不能为*预检请求头中会包含下面这些字段。预检响应头中会包含下面这些字段。...
2022-08-07 12:37:48
753
原创 js将时间戳转换为yyyy-mm-dd hh:mm:ss日期
const formatDate = time => { let date = new Date(time); return date.toJSON().substr(0, 19).replace('T', ' ').replace(/-/g, '-');};
2020-08-10 11:42:25
1449
2
原创 js验证文件后缀名的方法（有新方法就更新）
主要js let test = '1.2.3.4.5.6.Txt'; let hz = test.split('.').slice(-1)[0].toLowerCase(); console.log(hz); // 输出txt思路就是把文件名以 ‘. ’切割成数组，然后再取切割后数组的最后一项，最后转为小写验证单个直接判断是否相等就行验证多个 let arr = ['txt', 'mp4', 'mp3', 'mp2']; let name = name.split('.').slice(
2020-05-28 23:23:43
1175
原创 分享一个js获取图片原始尺寸的方法。亲测，好用！！！
首先，大部分人和网上能搜索到的获取图片分辨率或尺寸的方法，应该都是这样： let url = 'url'; function getUrlInfo(url) { let image = new Image(); let w,h; image.src = url; // 如果有缓存，读缓存 if(image.complete){ w = image.width; // 图片宽度 h = iamge.height; // 图片高度
2020-05-25 16:49:07
4190
8
原创 css实现鼠标经过让图片在div中放大和缩小
css:.container { width: 200px; height: 200px; overflow: hidden; } .container > img { width: 100%; cursor: pointer; transition: all 1s linear; } .container:hover img { transform: scale(1.2); }html:<div class="container"&g
2020-05-25 15:15:30
2543
6
原创 前端面试题分享
1、说说你对闭包的理解，闭包的好处和坏处，使用闭包的注意点。2、js如何实现继承？并写出相应的代码3、原生ajax原理，ajax有哪些优缺点？jQuery的ajax请求方式有几种？4、JavaScript有几种类型的值？你能画一下他们的内容图么？5、JavaScript创建对象的几种方式6、JavaScript原型、原型链？有什么特点?7、jquery .fn的 init方法返回的th...
2019-11-10 13:51:27
238
原创 关于Element-ui表单验证的坑
首先，根据官网示例，大家都知道element的表单验证是这样的：1、这是HTML部分，<el-form :model="ruleForm" :rules="rules" ref="ruleForm"></el-form>2、这是js部分,其中包含了规则和表单提交<script> export default { data() { ...
2019-10-21 17:52:44
1062
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人