- 博客(105)
- 资源 (6)
- 问答 (3)
- 收藏
- 关注
原创 如何将几百兆的包优化到几十兆----记一次vue项目的打包优化过程
本次优化最终实现将项目包的大小由116MB降到了21.6MB,优化率达到了80%以上,可以说是一次非常成功的优化了,让一个大型项目能在只有5MB带宽的网络中能顺利使用起来。
2024-07-17 14:53:56 1418
原创 Ngnix 常用配置及和基本功能
Nginx 是一款高性能反向代理服务器,学习它非常有必要,本文讲解了 Nginx 核心配置,介绍了反向代理,负载均衡,动静分离三大功能,最后扩展了一些常用的指令。本文介绍了 Nginx 的基础用法,后续的 Nginx 内核以及原理部分有待研究。
2024-05-07 17:49:39 898
原创 滚动条造成页面抖动
最近在做一个项目对于页面 UI 要求十分严格,需要精确到 1px 这就导致了有时候页面可以折叠在折叠与打开之后难免会出现滚动条,这就造成了出现滚动条之后页面会出现抖动这里我先采用的 js+padding-right 实现后面发现 css 有个属性可以直接实现。
2024-09-14 10:18:08 352
原创 canvas绘制表格
最近在为公司产品做技术预研,经理让用canvas做一个表格,于是就有了这篇博客。在这里为了方便实用我直接封装成组件了,当MQTT数据来了就出发绘制方法。我们的数据是后端通过MQTT推送过来的。具体MQTT的实现代码,可见博客。我在代码中也直接使用了。
2024-08-01 17:07:36 420
原创 konvajs绘制带有透明度的多边形
Konva 是一个HTML5 Canvas JavaScript 框架,它通过对 2d context 的扩展实现了在桌面端和移动端的可交互性。Konva提供了高性能的动画,补间,节点嵌套,布局,滤镜,缓存,事件绑定(桌面/移动端)等等功能。你可以使用 Konva在舞台上绘制图形,给图形添加事件,移动、缩放和旋转图形并且支持高性能的动画即使包含数千个图形。
2024-08-01 16:28:53 391
原创 Fabric.js 中文文档
Fabric.js 是一个功能强大的 canvas 库,它提供了一套丰富的 API 来操作 canvas 元素和上面的对象。通过配置项、方法和事件,开发者可以轻松地在网页上实现复杂的图形和交互设计。上述文档简要介绍了 Fabric.js 的一些基本用法和配置,更多高级功能和细节请参考官方文档。
2024-07-30 17:53:07 1701
原创 vite 初始化vue3项目Cannot find module ‘vue’. Did you mean to set the ’ moduleResolution’ option to ‘node’
Cannot find module 'vue'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option?
2024-07-16 14:24:51 301
原创 数据精度丢失
在开发过程中,发现从后台返回的数据结构中的id字段在前端显示为不正确的值。经过排查,怀疑是JavaScript中Number类型精度丢失的问题。通过将id字段的类型从Number改为String进行测试,确认了问题的根源。尝试在前端获取数据后立即转换为String类型,但发现数据在JavaScript中接收时精度已经丢失,因此最佳解决方案是让后端将id字段的类型改为String。
2024-07-16 12:17:50 431
原创 vue路由跳转报错Avoided redundant navigation to current location: “/xxxxxx“.
在使用Vue进行路由跳转时,若遇到“Avoided redundant navigation to current location”错误,这通常是因为尝试重复跳转到当前已经激活的路由。为解决这一问题,有两种主要方法。首先,可以考虑将vue-router版本升级到3.0,新版本可能已经修复了这个问题。其次,如果不想升级版本,也可以通过修改VueRouter原型对象上的push方法来避免这个错误。具体做法是在router文件中重写push方法,使其在执行时捕获并忽略这个错误,从而实现无缝的错误处理
2024-07-15 17:31:50 683
原创 log4js node日志插件
在Express后台项目的开发过程中,日志记录是一个重要的环节。起初,开发者可能考虑使用Node.js自带的console模块来实现日志输出,但往往发现其格式和功能无法满足实际需求。因此,经过搜索和比较,选择了log4js这一插件来实现更灵活的日志管理。
2024-07-15 17:25:32 399
原创 AI在编程领域的作用
AI(人工智能)在软件开发和许多其他领域都发挥着重要作用,但这并不意味着它在取代开发者。相反,AI更多地是在帮助开发者提高工作效率,解决复杂问题,并创造新的可能性。
2024-07-10 11:51:07 298
原创 2024前端面试题之Vue3
在面试前端工程师时,对于 Vue 3 的掌握程度是一个重要的考核点。本文将提供一系列针对这一级别工程师的 Vue 3 面试题,并附上详细的解析,帮助面试官全面评估候选人的技术实力和项目经验。
2024-07-10 11:35:09 1616
原创 程序员35岁会失业吗?
相反,通过合理的职业规划和持续的学习努力,许多程序员不仅能够在这一年龄阶段保持竞争力,还可能迎来职业生涯的新高峰。因此,即使从纯技术的角度看,年轻程序员在某些方面可能更具优势,但经验丰富的程序员在团队中仍然具有不可替代的价值。首先,必须承认的是,技术领域的确在不断变化,新的编程语言、框架和工具层出不穷。只要能够保持持续学习的热情,不断提升自己的技能和能力,那么无论年龄如何增长,都能够在竞争激烈的市场中立足。这意味着,无论是传统的软件开发还是新兴的技术领域,如人工智能、大数据等,都将持续需要大量的技术人才。
2024-04-01 11:20:23 654
原创 TreeData 数据查找
最近做需求的时候遇到了这样的一个需求,Tree组件数据支持查找,而且TreeData的数据层级是无限级的开始想的事借助UI组件库(Ant-design-vue)中的Tree组件的相关方法直接实现,看了下api 发现没法实现,后来想通过手动构建节点树实现,这样就需要写递归组件,需要重新写编辑,删除逻辑(本人有点懒所以就没采取),最后还是在数据上动手。
2024-02-22 15:31:25 643
原创 函数柯里化和反柯里化
柯里化和反柯里化都是非常有用的编程技巧,让我们可以写出更加灵活通用的函数。理解这两种技术的实现原理可以帮助我们更好地运用它们。在编码中,我们可以根据需要决定是将普通函数柯里化,还是将柯里化函数反柯里化。合理运用这两种技术可以大大提高我们的编程效率。
2023-08-02 15:26:49 156
原创 Cannot read properties of null (reading ‘setTransform‘)
Cannot read properties of null (reading 'setTransform')
2023-04-23 11:56:33 957
原创 mapbox-gl.js:30 Error: Layer with id “test_map“ already exists on this map
mapbox-gl.js:30 Error: Layer with id "test_map" already exists on this map
2023-03-02 15:58:31 506
原创 js语法基础
##一、JavaScript基本介绍及发展趋势ES5是2019年发布,在所有现代浏览器中得到了相当完全的实现###二、编写JS及如何运行JS1.在HTML普通标签中直接写入JS代码写在标签上的 js 代码需要依靠事件(行为)来触发
2023-02-09 17:46:31 301
原创 js坐标转换
这是一个功能丰富的地理位置坐标转换工具集,它支持WGS-84、GCJ-02和BD-09等多种坐标系统之间的相互转换,同时提供了Web Mercator投影坐标与WGS-84坐标之间的转换功能。此外,该工具集还能精确计算地球上两点间的距离,并判断一个给定的点是否位于中国境内。
2022-07-14 09:07:29 644
原创 VScode为Vue文件设置模板代码
VScode为Vue文件设置模板代码(1)\安装 Vetur 和 VueHelper 插件,安装完成后需要重启 VScode。(2)在扩展插件搜索框中找到如下 Vetur 和 VueHelper 两个插件,注意看图标,千万别安装错插件了(3)为 vue 添加模板代码片段。(4)选中 vue 项。(5)在打开的 vue.json 中加入你的模板代码片段。{ "vue": { "prefix": "vue", "body": [ " <!-- @description
2021-12-17 15:00:35 376
原创 BrowserRouter与HashRouter的区别
BrowserRouter与HashRouter的区别1.底层原理不一样:BrowserRouter使用的是H5的history API,不兼容IE9及以下版本。HashRouter使用的是URL的哈希值。2.path表现形式不一样BrowserRouter的路径中没有#,例如:localhost:3000/demo/testHashRouter的路径包含#,例如:localhost:3000/#/demo/test3.刷新后对路由state参数的影响1、Brows
2021-10-19 16:29:17 367
原创 antd按需引入与自定主题
antd的按需引入+自定主题1.安装依赖:yarn add react-app-rewired customize-cra babel-plugin-import less less-loader2.修改package.json将原有启动命令改为下列形式```json "scripts": { "start": "react-app-rewired start", "build": "react-app-rewired build",
2021-10-19 16:27:42 159
原创 React 三种路由传参
React 三种路由传参1、params传参优势 : 刷新地址栏,参数依然存在缺点:只能传字符串,并且,如果传的值太多的话,url会变得长而丑陋。// 路由页面:<Route path='/home/message/detail/:id/:title' component={Detail}/> //注意要配置 /:id//路由跳转并传递参数: //链接方式: <Link to={`/home/message/detail/${id}/${title}`}&
2021-10-19 14:19:11 247
原创 vue文件配置
vue-cli4 全面配置 细致全面的 vue-cli4 配置信息。涵盖了使用 vue-cli 开发过程中大部分配置需求。 不建议直接作为模板,希望能按照此教程按需配置,或者复制 vue.config.js 增删配置,并自行安装所需依赖。配置多环境变量 通过在 package.json 里的 scripts 配置项中添加–mode xxx 来选择不同环境 只有以 VUE_APP 开头的变量会被 webpack.DefinePlugin 静态嵌入到客户端侧的包中,代码中可以通过 proces
2021-10-10 19:28:41 901
原创 前端代码规范
前端代码规范Front Standard Guide前端 JS 项目开发规范规范的目的是为了编写高质量的代码,让你的团队成员每天得心情都是愉悦的,大家在一起是快乐的。引自《阿里规约》的开头片段:现代软件架构的复杂性需要协同开发完成,如何高效地协同呢?无规矩不成方圆,无规范难以协同,比如,制订交通法规表面上是要限制行车权,实际上是保障公众的人身安全,试想如果没有限速,没有红绿灯,谁还敢上路行驶。对软件来说,适当的规范和标准绝不是消灭代码内容的创造性、优雅性,而是限制过度个性化,以一种普
2021-09-23 16:28:35 196
原创 js中伪数组(类数组)
js中伪数组(类数组)伪数组js中伪数组(类数组)一、伪数组特性二、生成伪数组的方法三、将伪数组转为真正的数组一、伪数组特性具有length属性按索引方式存储数据不具有数组的方法, 比如push(),pop()等二、生成伪数组的方法在js中生成伪数组的方法比较多function的arguments对象document.getElementsByTagName和document.childNodes,返回NodeList对象的都是伪数组上传文件时选择的fi
2021-09-23 09:21:57 617
2024最全前端面试题
2024-07-15
vue+element后台管理类型框架.7z
2020-07-30
TA创建的收藏夹 TA关注的收藏夹
TA关注的人