![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
技术分享
文章平均质量分 86
末日码农
一个前端码农、会写一点代码
展开
-
用 rollup + gulp 造个轮子,别说还挺香
前戏我是16年入了前端的坑,17年知道了gulp和rollup这两个玩意儿。由于那时webpack势头很猛,便一直没有正眼瞧过它一眼。直到20年进了一家小公司,做了很多类似的小项目,相同的代码拷来拷去,出现一个bug一堆项目都要改,实在恶心到我了。于是不得不开始考虑将一些公共的方法和组件提取出来,做成一个第三方库来维护。而在库的封装方面,rollup相对于webpack具有一定的优势。在此,便和大家分享一下如何自己造轮子,封装一个前端库并发布到npm仓库中去。源码这是我自己封装的3个库,有兴趣可原创 2022-04-02 21:36:15 · 997 阅读 · 0 评论 -
通过uniCloud白捡一个在线图库管理工具,可做图床外链
喜欢写文章的技术大佬们,应该都有一个自己的在线图片管理工具吧。尤其是在写markdown时,为了让我们的文章“图文并茂”,显得不那么枯燥,就经常需要在合适的地方插入一些关联性的图片。据(xia)说(shuo)图片还能有效减少读者的视觉疲劳,使大脑有一个短暂的缓冲效果。然而,markdown中插入图片是严重依赖于在线可访问的图片的。如果没有一个专门的图片管理工具,要插入一张图片还真的很折腾人。介绍得益于现在云开发概念的兴起,前端小伙伴们的全栈之路变得轻松了许多。不用搭服务器、不用管数据库、不用买原创 2022-03-17 16:07:10 · 2906 阅读 · 0 评论 -
box-shadow 阴影的这些用法你知道吗?赶紧收藏起来
box-shadow的这些用法你知道吗?$shadowH: '';@for $i from 1 through 12 { $shadowH: #{$shadowH}, 0 ($i * 30px)}$shadowV: '';@for $i from 1 through 12 { $shadowV: #{$shadowV}, ($i * 30px) 0}.line { ... &::before { ... // 阴影 box-shadow: $原创 2022-03-17 12:06:57 · 592 阅读 · 0 评论 -
通过 hexo+serverless 快速搭建并部署一个自己博客(二)
继续接上一篇通过 hexo+serverless 快速搭建并部署一个自己博客(一) - 掘金 (juejin.cn)。serverless 部署选择serverless的原因,一方面是国内服务器,访问速度很快;另一方面是serverless本身也很划算,每个月都有免费的额度,对于个人博客站点,基本上也是不花钱的。现在国内最大的应该就是阿里云和腾讯云两家了,我用的是腾讯云的serverless。关于serverless相关的概念知识点比较多,对于非专业人士确实有很高的学习成本,官方文档都跟小说似的太多原创 2022-03-14 18:33:33 · 722 阅读 · 0 评论 -
通过 hexo+serverless 快速搭建并部署一个自己博客(一)
先看一下我的博客效果:https://moohng.com,没有写一行代码,全都是一些简单的配置。如果觉得还不错,接下来就从零开始介绍,照着做,差不多1个小时就可以搞定了。创建站点项目这是Hexo的官网:https://hexo.io/zh-cn/docs/,有基础的可直接参照官方文档来,然后跳到Serveless 部署部分。本地 node 环境安装打开Node.js官网:https://nodejs.org/zh-cn/,选择最新的长期维护版下载,然后正常双击进行安装。安装完成之后,按住W原创 2022-03-14 18:30:36 · 1207 阅读 · 0 评论 -
告诉你前端配色的秘密:怎么配都好看
不知道大家在开发个人项目的时候,有没有遇到过以下的问题:我的页面主色调用什么颜色?背景色又用什么颜色?辅助色呢?对于可自定义主题的项目,如何根据用户选择的主色调生成其他辅助色呢?…前面3个问题,大家可以去参考专业的配色网站来,但是对于第4个问题,在页面颜色不确定的情况下,如何根据用户设置的主色调生成一整套的配色方案?而且还得保证不同颜色之间的辨识度。…到最后,就只能使出配色终极大法:黑、白、灰,3个色调来搞了。黑白灰虽是万能配色,但是对于有些类型的项目,黑白灰确实也显得有些不搭。例如,我原创 2022-02-28 10:01:04 · 1765 阅读 · 0 评论 -
颜色操控大法:如何封装一个颜色选择组件?
本篇文章主要分两部分来讲解,首先带你进一步认识一下颜色模型相关的概念,然后在此基础上封装一个自己的ColorPicker组件。同时,在文章结尾处将分享一个前端小技巧,不要错过哦!原创 2022-02-25 17:40:17 · 547 阅读 · 0 评论 -
踩坑小程序canvas,撤销操作实现
接上一篇文章:踩坑小程序canvas,uni + vite + vue3 搞起来小程序搜索【涂图了】,可进行体验。轨迹自动播放实现在画布上绘制笔迹的时候,通过touchmove事件将每一次绘制的点坐标都记录起来,同时也要将当前笔迹的颜色、宽度等数据记录起来。最终画布上所有的笔迹都转换成了一个数据列表,当播放的时候,再将列表里面的数据一条一条的在canvas上重新绘制出来,通过setTimeout进行自动循环不断的去绘制。看代码:class Paint { // ...省略... /**原创 2022-02-11 10:59:09 · 1614 阅读 · 0 评论 -
踩坑小程序canvas,uni + vite + vue3 搞起来
微信搜索【涂图了】即可体验小程序功能画布的实现背景的实现将画布保存在本地未完待续先放出小程序码:功能先列出目前小程序已完成了功能:笔记绘制;颜色和宽度;背景;撤销;恢复撤销;清空;保存本地;笔记播放;分享/口令分享;下面简单介绍几个重要的功能实现画布的实现由于一开始使用了uni + vite + vue3来进行小程序的开发,遇到的第一个坑就是当前版本的uni不支持canvas响应touch事件,从而直接导致无法进行正常的绘制操作。于是就给uni-app提了一个issue,原创 2022-02-10 11:48:59 · 1585 阅读 · 0 评论 -
js中的异步处理:你想知道的都在这了
假如你已经知道了什么是异步,并且已经写过很多的异步代码。这篇文章主要介绍几种对异步代码的处理,即异步编码姿势:回调函数;Promise;迭代器、生成器;async/await。重点在第3、4部分。回调函数这个没什么好说的,直接看一段代码:const fs = require('fs');fs.readFile('config.json', (err, data) =>...原创 2019-09-21 00:47:28 · 126 阅读 · 0 评论