自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

IT飞牛

大前端工程师的日常技术分享

  • 博客(232)
  • 问答 (1)
  • 收藏
  • 关注

原创 解决Antd Tree组件,二次点击时不取消选中,保持高亮

然而大多数业务场景下,我们希望多次点击同一个节点不会取消他的选中效果。支持点击高亮树节点,再次点击取消高亮。

2023-06-12 09:23:21 2627 3

原创 window10安装vim编辑器

我们在做git操作的时候,很多文字编辑工作会默认打开Vim编辑器来进行操作。Vim是一个高度可配置的文本编辑器,旨在让创建和更改任何类型的文本变得非常高效。大多数和都将它作为vi包含在内,用惯了中的Vim编辑器,如果需在的中编辑文件,则需要单独安装视窗版的Vim。

2023-05-30 22:19:34 4446

原创 VirtualBox安装增强功能

在刚安装完的VisualBox中,默认屏幕是固定设置的,不会根据实际的窗口大小做自适应,这时候我们需要【安装增强功能】,然后打开【自动调整显示大小】,就可以实现虚拟机中屏幕自适应。宿主机:window10。

2023-05-28 00:17:57 9478

原创 如何检测docker是否支持host.docker.internal

它提供了一种简便的方式来访问宿主机上的服务。但是,这个主机名在不同的 Docker 版本和环境中的支持情况可能会有所不同。主要用来诊断域名系统 (DNS) 基础结构的信息。查询DNS的记录,查询域名解析是否正常,在网络故障时用来诊断网络问题。如果查询失败或显示其他错误消息,则可能是因为您的 Docker 版本不支持。如果输出显示了宿主机的 IP 地址,则说明 Docker 支持。运行一个临时容器:使用以下命令在交互模式下启动一个临时容器。如果您看到类似于以下输出,表示您的 Docker 支持。

2023-05-25 14:43:27 7811

原创 linux安装mysql的两种方式

1、在安装之前查看下系统是否已经安装了mysql2、安装mysql-server3、再次查看,发现多了个mysql4、登陆。

2023-05-23 10:31:39 1464

原创 React+Antd+Vite+TypeScript 项目实战教程

本教程属于react入门教程,课程围绕如何搭建一个简单的登录页面展开,会带你快速了解react、redux、redux-devtool、react-router-dom、axiox这些常见技术的使用方式,教程最后会附上项目源码。

2023-05-10 00:22:12 7005 10

原创 Cesium基础教程

Cesium是国外一个基于javascript的地图引擎,支持3D、2D、2.5D形式的展示,可以自行绘制图形、高亮区域,并提供良好的触摸支持,并支持大多数的浏览器和移动端。

2023-04-20 23:16:50 16579 5

原创 pip使用教程

Linux/Mac os 环境中,配置文件位置在。文件,可以更好地管理第三方库,随时安装与卸载。利用pip的r参数,配合自定义的。

2023-04-04 11:30:16 366

原创 Vite2.0常见配置

Vite2.0常见配置项随笔。别名、按需引入、打包分析、支持gzip、环境变量、国际化

2023-04-02 15:28:20 2245

原创 【2D标注】cvat-canvas重写polyline拖拽交互方式

在中,针对polyline的拖拽默认相应区域是polyline头尾连线组成的闭合区域,这也是默认的hover响应区域,具体如图:这样的响应方式,在一些场景下是极其难选择的,例如:1、只有一条线时,闭合区域就时一条线,大小很难选择。2、多个polyline重叠在一起时,会存在区域交集,在交集内选择时,默认永远会选者到上层的折线,选不到下层的。

2023-04-02 15:24:49 746

原创 【2D标注】cvat-canvas添加标尺线

在使用做2D标注开发时,有时我们需要对2D图形添加一些标尺线,例如前方距离当前摄像头的距离标尺。这时候我们需要添加标尺线。

2023-04-02 14:15:29 781

原创 【ThreeJs】如何给模型打上文字标签?

ThreeJs渲染中创建的网格模型,有时候我们需要给模型添加标签文字,方便识别不同的物体。这时候我们可以使用这两个库,里面提供了三种打标签的方式,随着相机角度的变化,三种标签的显示效果各不相同。

2023-03-11 23:15:50 12540 8

原创 webGL编程指南实战教程

顶点着色器是GPU渲染管线上一个可以执行着色器语言的功能单元,具体执行的就是顶点着色器程序,webgl定点着色器程序在javascript中一字符串的形式存在,通过编译处理后传递给顶点着色器执行。片元着色器和顶点着色器一样是GPU渲染管线上一个可以执行着色器程序的功能单元,顶点着色器处理的是逐顶点处理顶点数据,片元着色器是逐片元处理片源数据。下面,我们在上面绘制多个点的案例基础上,改用缓存对象来实现,并且鼠标点击制作坐标收集保存,不做渲染,点击渲染按钮时,一次性对缓冲区中的顶点数据做渲染。

2023-03-05 11:37:26 2481

原创 怎么使用Web Workers提升性能?

Web Workers 使得一个Web应用程序可以在与主执行线程分离的后台线程中运行一个脚本操作。这样做的好处是可以在一个单独的线程中执行费时的处理任务,从而允许主(通常是UI)线程运行而不被阻塞。它的作用就是给JS创造多线程运行环境,允许主线程创建worker线程,分配任务给后者,主线程运行的同时worker线程也在运行,相互不干扰,在worker线程运行结束后把结果返回给主线程。这样做的好处是主线程可以把计算密集型或高延迟的任务交给worker线程执行,这样主线程就会变得轻松,不会被阻塞或拖慢。

2023-03-02 23:26:17 872

原创 uni-app实战教程

开发工具:HBuilderX跨段框架(uniapp以对齐微信小程序api的形式封装了一套跨端框架,可以横跨10个不同的小程序平台)HTML5+ (支持原生ios,android)云开发。

2023-02-16 22:30:25 3864

原创 微信小程序开发教程

打开开发者工具,用微信扫码进入创建页面,填写配置如下:需要注意的是:AppId可以选择已经注册的账号Appid,也可以选择测试号。区别是测试号不支持云开发。这里暂时选择测试号。完成配置后,点击底部确定按钮,然后会进入一个初始化的页面,第一次打开可能有些慢,耐心等待即可;

2023-02-16 00:46:15 4252

原创 svg.js使用教程

在日常web开发过程中,我们会需要显示一些图形化的元素,使用div+css、ps图片是常见的实现方式。但使用svg来绘制可能更加合适,SVG是,有一些预定义的形状元素,可被开发者使用和操作: 矩形(rect)、 圆形(circle)、 椭圆(ellipse)、 线(line)、 折线(polyline)、 多边形(polygon)、 路径(path)。svg可以是独立的*.svg文件,可以通过来引入。也可以直接将svg代码写入html中,开发和使用起来非常灵活。本教程主要介绍svg.js。

2023-02-13 11:09:22 9133 1

原创 TypeScript基础教程

JS已有类型和TS新增类型。原始类型:string、number、boolean、null、undefined、symbol对象类型:object(数组、对象、函数等对象)TS新增类型联合类型、自定义类型(类型别名)、接口、元组、字面量类型、枚举、any等。

2022-09-25 02:33:22 5816

原创 乾坤实战教程

● qiankun 是一个基于 single-spa 的微前端实现库,旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。● 使用简单○ 技术栈无关,任意技术栈的应用均可 使用/接入,不论是 React/Vue/Angular/JQuery 还是其他等框架。○ HTML Entry 接入方式,让你接入微应用像使用 iframe 一样简单。● 功能完备:几乎包含所有构建微前端系统时所需要的基本能力。○ 样式隔离,确保微应用之间样式互相不干扰。

2022-09-07 20:08:53 1196

原创 Nacos+Node基础教程

Nacos是一个更易于构建云原生应用的动态服务发现、配置管理和服务管理平台。

2022-07-29 00:41:47 3999 1

原创 Docker基础教程

docker中级教程

2022-07-24 00:23:03 695

原创 如何将Typora中图片上传到csdn

本地Typora笔记,上传到csdn时,能自动识别图片;

2022-07-23 13:56:22 1929

原创 Node版本如何升级

Node版本如何升级

2022-07-03 16:45:47 130388 12

转载 查看系统端口占用

查看系统端口占用

2022-07-03 16:23:04 211

原创 nodemon和pm2快速部署服务

nodemon和pm2快速创建服务

2022-07-03 15:36:54 984

原创 Vuepress 文档脚手架(vue 3.x+vuepress2.x+vite+ts)

这里提供一个解决方案,那就是Vuepress框架,最新的 Vuepress2.x 框架已经蓄势待发,支持Vue3.x。创建目录2、初始化项目3、将 VuePress 安装为本地依赖4、在 package.json 中添加一些 scripts5、将默认的临时目录和缓存目录添加到 .gitignore 文件中6、 创建你的第一篇文档7、在本地启动服务器来开发你的文档网站VuePress 会在 启动一个热重载的开发服务器。当你修改你的 Markdown 文件时,浏览器中的内容也会自动更

2022-06-19 16:19:20 5422 10

原创 利用渲染函数,实现动态创建弹窗-Vue3.X

Vue2.0版本的动态弹窗创建,请参考:vue利用渲染函数创建弹窗组件,完美支持传值和事件监听(Vue2.X)基于element-plus框架文件目录结构├─ src│ ├─ ...│ ├─ package│ │ ├─ index.ts│ │ ├─ layer│ │ │ ├─ alert.vue│ │ │ ├─ confirm.vue│ │ │ └─ modal.vue│ │ └─ layer.ts代码src\package\layer.ts

2022-04-23 10:58:57 1959

原创 npm link的使用演示

我们在本地开发一些npm包的时候,如果需要测试这个包,那么一般会在开发包中直接创建测试环境来测试;或者npm publish发布到npm仓库,然后创建测试项目,通过npm install安装来进行测试。包的开发过程需要不断的调试,每次调试完都要发布到npm仓库,然后在更新测试项目中的依赖,不免有些麻烦,这个时候就可以使用npm link。如何使用创建npm-module创建npm-module文件夹,进入文件夹执行npm init -y,生成package.json文件。创建src/index.

2022-03-06 19:49:12 1637

原创 egg支持路径别名@

module-alias别名设置设置别名可以简化require引入路径长度,但是node默认不支持,可以借助module_alias来实现对别名的支持,类似webpack中resolve:{alias:{"util":path.join(__dirname,'src','util')}},,支持@符号。安装安装:npm install module-alias --save使用:package.json 中添加 "_moduleAliases": { "@root": ".", "

2022-02-27 11:13:56 857

原创 Git高阶教程

​刚开始使用git的时候,总想拿git来和cvs或者svn来作对比,但不久后发现这个想法本身就是错的,git完全就是另外一种物种,一种本属于未来的物种。它的对象存储方式,快照,分支等,都是完全不同的。相信每个使用git的人,都想了解git内存文件的存储对象,快照,提交在历史和分支等内部的原理。都想知道它是否有传说中的那么强大?Git相比较其他版本控制系统最大的优势无异于:1、底层文件存储系统2、分布式的特性​​git基本原理需要搞清楚以下名词的概念:工作区(Workspace):就是

2022-02-20 14:59:25 875

原创 Docker安装和部署

Window10进入应用和程序,安装Hyper-V虚拟机如果Hyper-V虚拟机监控程序被禁用,需要进入BIOS开启Cpu虚拟化技术下载安装Docker desk for windows,安装会检测Window10版本和WSL版本,更新最新Window10版本,下载WSL2就行安装完成后,打开Poweshell,运行 docker run hello-world。如果出现 unable to find image “hello-world”…,表示安装已成功!配置ECS到阿里云购买ecs主

2021-12-08 10:28:03 3516

原创 Promise队列应用实例(爬虫)

每隔一秒输出数组中的一个字符串,直到全部输出完成为止var arr=["你好","hello","hi","good morning","nice to meet you"];function run(str){ //异步输出字符串 return new Promise(function(resolve,reject){ setTimeout(function(){ console.log(str); resolve(str

2021-10-31 10:49:44 237

原创 穷举数组所有子集

Function subsets(nums){Let r=[],len=nums.lengthFor(let I =0;I <1<<){let are=[]}}

2021-10-13 00:32:31 464

原创 egg框架各个上下文中的this中有些啥?

Controller 实例Controller 类继承于 egg.Controller,会有下面几个属性挂在 this 上。this.ctx: 当前请求的上下文 Context 对象的实例,通过它我们可以拿到框架封装好的处理当前请求的各种便捷属性和方法。this.app: 当前应用 Application 对象的实例,通过它我们可以拿到框架提供的全局对象和方法。this.service:应用定义的 Service,通过它我们可以访问到抽象出的业务层,等价于 this.ctx.service 。t

2021-09-25 21:58:50 994

原创 egg项目添加自动化swagger-ui可视化文档功能,支持Authorization验证

后端使用egg完成接口开发,借助swagger自动化,大大方便前后端的数据业务对接工作,做到所有接口有文档可查。这里介绍使用npm install egg-swagger-doc-feat来实现,自动生成接口文档,如图:一、安装npm i egg-swagger-doc-feat --save二、用法// {app_root}/config/plugin.jsexports.swaggerdoc = { enable: true, package: 'egg-swagger-doc-

2021-09-02 21:49:02 2749 9

原创 vue利用渲染函数创建弹窗组件,完美支持传值和事件监听(Vue2.X)

弹窗组件和其他组件不同,在页面初始化的时候,页面dom结构中是不存在弹窗组件的div节点,只有在调用时弹窗组件的div在会被动态的添加到页面中,并且当删除时,也需要在页面中删除;结合弹窗组件的使用场景,比较合适的实现是使用createElement渲染函数,渲染函数可以动态的创建组件,并且通过props、on属性,传入组件的标题、内容,监听组件的事件;观察看下面这段代码: const vm = new Vue({ render: h => { .

2021-08-24 12:46:03 3619

原创 cURL安装和常用实例

cURL是一个利用URL语法在命令行下工作的文件传输工具,配置后,可以在命令行直接执行各类操作,也可以作为源码包,载入到各类后端开发,为后端提供文件传输能力;安装下载演示电脑是win10 64位,下载对象的包,下载地址配置环境变量这里下载下来的文件有的不是zip格式,找下下载个zip的包,解压后,内部文件如图:配置环境变量:新建CURL_PATH系统变量;编辑PATH,加上这两行(具体路径根据curl包实际路径填写):%CURL_PATH%\I386C:\Program.

2021-08-22 13:14:36 845

原创 一篇文章教你如何使用egg-jwt生成jwt+校验+错误拦截+设置过期时间

egg-jwt是适配egg的jwt鉴权插件,在讲这个插件如何使用前,先回顾下jwt的原理。Json web token (JWT), 是为了在网络应用环境间传递声明而执行的一种基于JSON的开放标准((RFC 7519).该token被设计为紧凑且安全的,特别适用于分布式站点的单点登录(SSO)场景。JWT的声明一般被用来在身份提供者和服务提供者间传递被认证的用户身份信息,以便于从资源服务器获取资源,也可以增加一些额外的其它业务逻辑所必须的声明信息,该token也可直接被用于认证,也可被加密。JWT

2021-08-22 00:06:30 3643 1

原创 Webpack构建多页应用Mpa(四):提取公共js、css、html代码,实现图片、字体单独打包,拆分多环境配置文件

上一节教程Webpack构建多页应用Mpa(三):文件结构和自动化打包中,我们完成了Mpa的文件结构和自动化打包,这一节我们继续完善,完成公共html代码的提取,并自动化导入。例如:A.html、B.html、C.html三个页面都有的头部代码header.html,自动化...

2021-08-01 22:40:37 1240 1

原创 Webpack构建多页应用Mpa(三):文件结构和自动化打包

本系列教程整体完成后,会完成一个可用的MPA应用,教程实际就是整个MPA的实现过程的记录。如果是想了解单项功能的实现,请继续往下看;如果是想了解整个MPA的开发和思考过程,建议从 Webpack构建多页应用Mpa(一):阐述设计概要 教程开始看起…我们需要实现的是一个多页面应用,到目前为止,我们还没有讲到如何创建多页面?以及如何规划文件存放结构?一、概述我们在做SPA单页面应用时,往往会使用一些现成的框架脚手架来做,框架本身已经提供了整套的解决方案,如页面切换、页面结构规划、公共文件结构规划等。.

2021-06-09 00:07:08 850

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除