不知名前端
码龄6年
求更新 关注
提问 私信
  • 博客:249,458
    社区:58
    249,516
    总访问量
  • 42
    原创
  • 317
    粉丝
  • 14
    关注
IP属地以运营商信息为准,境内显示到省(区、市),境外显示到国家(地区)
IP 属地:浙江省
加入CSDN时间: 2019-07-15

个人简介:恢复更新

博客简介:

yun_master的博客

查看详细资料
个人成就
  • 获得209次点赞
  • 内容获得109次评论
  • 获得587次收藏
  • 代码片获得1,891次分享
  • 博客总排名637,540名
创作历程
  • 1篇
    2024年
  • 2篇
    2023年
  • 7篇
    2022年
  • 28篇
    2021年
  • 2篇
    2020年
  • 4篇
    2019年
成就勋章
TA的专栏
  • NodeJS
    2篇
  • git
    2篇
  • js库
    2篇
  • 浏览器API
    1篇
  • 原生js
    14篇
  • Express
    1篇
  • 音视频专栏
    7篇
  • react
    4篇
  • 前端工程化
    5篇
  • css\css预处理器
    2篇
  • canvas
    1篇

TA关注的专栏 3

TA关注的收藏夹 0

TA关注的社区 1

TA参与的活动 0

兴趣领域 设置
  • 前端
    javascriptcsses6webpack前端框架
  • 后端
    node.js
  • 网络与通信
    https
  • 微软技术
    typescript
创作活动更多

新星杯·14天创作挑战营·第13期

这是一个以写作博客为目的的创作活动,旨在鼓励大学生博主们挖掘自己的创作潜能,展现自己的写作才华。如果你是一位热爱写作的、想要展现自己创作才华的小伙伴,那么,快来参加吧!我们一起发掘写作的魅力,书写出属于我们的故事。我们诚挚邀请你们参加为期14天的创作挑战赛!注: 1、参赛者可以进入活动群进行交流、互相鼓励与支持(开卷),虚竹哥会分享创作心得和涨粉心得,答疑及活动群请见:https://bbs.csdn.net/topics/619781944 【进活动群,得奖概率会更大,因为有辅导】 2、文章质量分查询:https://www.csdn.net/qc

90人参与 去参加
  • 最近
  • 文章
  • 专栏
  • 代码仓
  • 资源
  • 收藏
  • 关注/订阅/互动
更多
  • 最近

  • 文章

  • 专栏

  • 代码仓

  • 资源

  • 收藏

  • 关注/订阅/互动

  • 社区

  • 帖子

  • 问答

  • 课程

  • 视频

搜索 取消

如何从零开发一个脚手架

本文章尽量用最简单的方式来说明,脚手架如何开发。其中对于依赖的使用,可以查找对应依赖的文档进行查看。这个可以根据ejs文档来参考,在download远程模板结束之后,遍历download下来的模板文件,并用ejs引擎进行解析替换即可。用gitlab举例子,去gitlab中选择个人令牌,选择权限范围后,创建个人令牌。可以看到,@的后半部分是git模板的地址,前半部分是个人令牌。使用download-git-repo库拉取远程代码的时候。1、git拉取模板时,如何开放模板的clone权限。
原创
博文更新于 2024.04.15 ·
567 阅读 ·
6 点赞 ·
0 评论 ·
5 收藏

window.requestAnimationFrame强大的前端动画神器

今天介绍一个功能强大的api—window.requestAnimationFrame,它既可以实现如丝般顺滑的动画,又能充当性能优化的利器,还能代替setTimeout,setInterval等定时器。自从学会了requestAnimationFrame,我已经不会拼写setInterval啦…背景动画的实现与浏览器显示在讲具体功能和api使用方法之前,我们先来大体聊一下api的背景和原理。在各类影视节目横行的今天,大家应该都对电影或是动画的实现有一定了解,最开始的动画是工作人员,一张图一张图画出
原创
博文更新于 2024.01.04 ·
4627 阅读 ·
3 点赞 ·
2 评论 ·
24 收藏

js实现拼音模糊搜索

全列表的模糊搜索,通过接口实现的搜索,受制于网络传输,体验多少都会有点差。某些场景下,前端实现的模糊搜索,不但效果出色,而且性能、体验俱佳
原创
博文更新于 2024.01.04 ·
2632 阅读 ·
0 点赞 ·
0 评论 ·
1 收藏

js万能类型检测Object.prototype.toString.call——定制Object.prototype.toString.call的检测结果

要说这个知识有什么用,在什么场景可以用,可以说基本上是用不上。但是可以了解我们这些常用的方法,到底是什么原理,为什么会有这样的结果。在日常中遇到问题的时候,更能得心应手的排查问题。甚至优化自己的代码。
原创
博文更新于 2023.02.10 ·
2280 阅读 ·
1 点赞 ·
4 评论 ·
6 收藏

js实现回到上一页的功能,介绍三种方法,其中一种在新开的页面中也适用

话不多说,看例子1、history.go()可以回到,前进任意一步的页面,回到上一页,如下所示// 回到上一页window.history.go(-1);// 回到下一页window.history.go(1);// 回到任意一页widnow.history.go(+前进几页)2、history.back()// 回到上一页history.back()3、document.referer以上两种方式,基本上大家都清楚,但是我们常常会遇到的一个场景,并不适用.比如当你的页面点
原创
博文更新于 2022.10.13 ·
26112 阅读 ·
15 点赞 ·
2 评论 ·
24 收藏

css的原生变量&css的各种操作小技巧

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一、原生css变量1、基础用法2、js定义css变量/行内定义变量注意二、css3的currentColor关键字三、通过dom自定义属性, 替换伪元素内容正常使用伪元素js替换伪元素内容总结前言记录日常css变量的一些使用技巧, 方便在自己忘记时,及时查阅.一、原生css变量1、基础用法<body> <div class="test"></div> <div cla.
原创
博文更新于 2022.05.28 ·
802 阅读 ·
0 点赞 ·
0 评论 ·
0 收藏

js实现的复制和粘贴

背景前段时间在玩原神的时候,发现同事也在玩,于是和同事讲加下好友,以后可以一起玩。但是当同事复制uid的时候,却发现原神游戏中复制的uid,无法粘贴到wx中。于是乎,身为开发的我们就讨论起来,这是不是bug啊,是什么原因啊。今天就来和大家分享下,如果是web前端,我们这个复制和粘贴是怎么弄的。模拟粘贴板首先,如果想要达到一个类似原神的那种效果,在我的页面复制的东西,只能在我的页面粘贴。(ps:一样东西也别想带走)那么,我们可以自己模拟一个系统粘贴板。举个例子 const preview = d
原创
博文更新于 2022.05.13 ·
1471 阅读 ·
0 点赞 ·
0 评论 ·
1 收藏

express的模版引擎

背景这几天公司需求不多,抽了一两个小时的时间学习了一下express这个库,因为我半路出家入行较晚,以前只听说过ejs之类的模版引擎,但是不太明白他的工作原理,正好express文档中有简单的介绍,所以研究了一下,觉得还是挺好玩的。分享一下,大家一起学习,有大佬有更深入的文档,也欢迎在评论区分享。才接触node的后端代码,不太懂,如果有问题,欢迎随时指正在express中使用模版引擎为了方便和我一样的小白,一步一步跟着做,下面我将我demo步骤一点点的拆开一、创建项目1、创建根目录(准备工作)/
原创
博文更新于 2022.05.13 ·
1238 阅读 ·
1 点赞 ·
1 评论 ·
1 收藏

git常用高危命令整理

以下操作均属高危搞作,请谨慎使用一、移除错误的push(操作一旦完成无法恢复)1、查询想要回退的commit-id, 一般选择出错commit的前一个commit-id,并复制下来git log2、切换到对应的commitgit reset --hard <commit-id>3、强制提交代码git push -f总结:这个方法,适用于push了一份错误的代码,且没有其他人在这份错误代码的基础上进行开发,切换到对应的commit后,强制提交,会将切换对应commit之前的全
原创
博文更新于 2022.04.13 ·
907 阅读 ·
1 点赞 ·
2 评论 ·
1 收藏

moment.js的实用方法记录

一、获取时间戳1、获取当前时间戳moment(new Date()).valueOf();等效于:Date.now();2、获取任意时间时间戳// 年月日,任意格式,第二个参数对时间格式进行说明moment('2022-01-02', 'YYYY-MM-DD').valueOf()moment('20220102','YYYYMMDD').valueOf()moment('2022/01/02', 'YYYY/MM/DD').valueOf()// 时分秒,任意格式,同上, 当省略年
原创
博文更新于 2022.04.11 ·
1694 阅读 ·
2 点赞 ·
0 评论 ·
4 收藏

JSON.stringify的妙用,批量删除object的属性

说这个功能其实只是要分享JSON.stringify的第二个参数,先看例子omit—根据obj的key,批量保留或是删除对应的属性// 目标对象const example = { name:"不知名前端", age:18, height:180, weight:150, sex:'boy',}// 保留属性集合const keepAddr = ['age','name','height'];// 删除属性集合const deleteAddr = ['height','sex','
原创
博文更新于 2022.04.02 ·
1700 阅读 ·
0 点赞 ·
0 评论 ·
0 收藏

如何使用js实现下载视频,并且不跳转页面

js实现下载文件,相信99%的前端都能轻松实现,但是如果下载的是视频,相信有的朋友肯定遇到过,视频没有下载,而是跳转了.一个小小的坑,下面我来分享一些方法避免这个问题首先先来一个普通文件的下载实现方式a标签直接通过url下载文件(视频会发生跳转) function download(url,name){ const a = document.createElement("a"); a.href = url; a.download = name; a.click(); }a标签通过
原创
博文更新于 2022.04.02 ·
16317 阅读 ·
8 点赞 ·
20 评论 ·
43 收藏

react实现弹窗、弹窗的静态方法的方式

ReactDOM.createPortal(ReactNod,container)实现弹窗的关键在于,如何将弹窗组件挂载到任意的dom上.这里react-dom中提供了一个方法,下面举个例子import React from 'react';import ReactDOM from 'react-dom';const Modal = (props) => { const { container } = props; return ReactDOM.createPortal( /
原创
博文更新于 2022.03.31 ·
7596 阅读 ·
1 点赞 ·
7 评论 ·
11 收藏

js实现影视级滤镜效果,lut3d的前端实现

前端实现滤镜有几种方式,比如css的filter、webgl、svg等等, 其中css和svg可以实现低维度滤镜,优点是简单,方便, 无性能问题. webgl可以实现多维度滤镜, 其中选择可以自己纯手工的去撸各类滤镜算法,也可以使用现成的工具库再手动拼凑, 但是对于不懂webgl的同学来讲,着实有点麻烦. 今天分享一个基于canvas实现的影视级滤镜的方法.lut3d想要讲清楚滤镜是怎么回事,并不是一件容易的事情. 里面涉及到了一些概念性的东西. 这里也不得不来简单介绍一部分内容.首先我们先来了解一下
原创
博文更新于 2022.03.29 ·
3498 阅读 ·
0 点赞 ·
4 评论 ·
9 收藏

阿里iconfont上传svg图片空白、或展示不全的解决方案/搜索到的icon无法改变颜色解决方案

原因造成这个问题的原因,可能是因为sketch、dx等软件在导出svg时,自动在svg上添加了一些iconfont平台无法解析的属性造成的。所以解决这个问题,要么从svg代码入手,要么就需要借助工具来完成。解决改代码并不是很理想的解决方式,这里我们借助iconfont官方平台推荐的图形设计软件AI来解决这个问题。1、首先下载一个AI软件2、然后使用AI打开通过其他设计软件导出的svg图标3、选中整个图标,然后选择对象—扩展—选择描边(已经选择取消,重新选择)——确定4、保存为svgsvg配置
原创
博文更新于 2022.03.22 ·
16774 阅读 ·
6 点赞 ·
0 评论 ·
10 收藏

前端上传oss自定义方法,支持获取上传进度,附带上传文件管理代码

自定义上传函数function upload({ token, file, pathName, data, headers, onProgress, onSuccess, onErrorÏ}){ const xhr = new HMLHttpRequest(); // 携带cookie xhr.withCredentials = true; // 错误事件 xhr.onerror = (error) => { onError(error); }; if(xh
原创
博文更新于 2022.01.20 ·
1309 阅读 ·
0 点赞 ·
0 评论 ·
0 收藏

js取到顶层对象的几种方式

前言众所周知,js是一门脚本语言,它依赖浏览器作为自己的执行环境.但是并不是只有浏览器可以作为js的执行环境,所以,浏览器提供的一些api,addr或者是顶层对象(window),在非浏览器的环境下,就无法使用了.那么这里我将记录几种在浏览器中可以获取到顶层对象的方式.因为作者的工作仅限于浏览器环境的开发,所以这里只做记录,并不会给出兼容方案.后续当作者了解了详细情况,再进行更新1、window2、this3、self4、top5、globalThis暂时作为记录,后面会了解各种方式的优缺点,
原创
博文更新于 2022.01.20 ·
1552 阅读 ·
0 点赞 ·
0 评论 ·
0 收藏

js实现文件上传、文件预览、拖拽上传的方法

一、文件上传1、上传的html我们可以使用input实现文件上传<input type="file" id="upload">2、访问上传的文件通过dom访问const input = document.querySelector("#upload");const files = input.files;通过onchange事件访问const input = document.querySelector("#upload");input.addEventListener(
原创
博文更新于 2022.01.20 ·
19186 阅读 ·
9 点赞 ·
7 评论 ·
50 收藏

在react中使用vite的一些配置,包含less全局变量、proxy、别名等常见配置方式

最近换了新的工作,因为新公司的项目使用微前端的集成方案,一个项目被从组件层面拆分出来不少单独的模块,所以经常需要新创建项目。也是因为以上的背景,让我有更多的机会尝试不同的工程打包方案,其中一个便是以速度著称的vite。下面我将工作中遇到的一些问题,已经配置方式记录在这里,以便自己,或是其他看到的朋友作为参考1、vite.config.js使用vite,首先要在项目根目录创建vite.config.js的文件,如果使用ts的话,也可以是.ts文件。这里其实重点想要说的是,vite属于新兴的工具,所以对
原创
博文更新于 2021.09.02 ·
10207 阅读 ·
12 点赞 ·
7 评论 ·
27 收藏

wands一个轻松实现音视频播放控制的库

前言随着短视频业务越来越火爆,很多公司都想在这个赛道争一口饭吃, 作为开发者来说, 当第一次接手音视频项目的时候,包括我在内的很多人都是表示非常的头大, web上充斥着各种教程,各种api应接不暇, 中间也有着实不少的坑在等着我们.所以我就想利用业余时间,将工作中的一些方案,抽象出来分享给大家.wands这是一个针对h5原生video, audio标签的一个扩展功能库,体量也很小, 对于不熟悉音视频API, 可以说是一个比较方便的选择.目前还不是特别完善,后期会逐步添加新的功能,逐步将它打造成一个可以
原创
博文更新于 2021.06.20 ·
223 阅读 ·
2 点赞 ·
0 评论 ·
0 收藏
加载更多