![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Web前端
文章平均质量分 80
Web前端
IT飞牛
这个作者很懒,什么都没留下…
展开
-
【@changesets/cli】变更集实战教程
前端目前基于Monorepo架构的npm包开发很普遍,在开发完毕后,我们需要对包进行版本号升级,并且部署,这些操作如果是手动来操作的话,很麻烦,而且容易出错。我们在发版的时候,需要手动去更改corelayoutplugins三个插件包的版本号。并且如果要查看每个包的变更迭代的话,需要单独查看子包的git log进行查看,但是有时git log的记录不代表版本真正的迭代变更,最常见的是子包的一个特性开发,会分成多个commit去提交。原创 2024-03-25 16:41:21 · 1167 阅读 · 0 评论 -
npm publish发布到在线仓库时,提示:Scope not found
这是由于包名是`@xxx/xxx`形式造成的。如果包名是`@`开头,需要到npm官网先创建一个组织。3. 进入创建组织页面,输入组织名称。(这里不需要加上`@`符号)4. 再次执行`npm publish`命令,这是就可以正常发布。1. 注册`npm`官网账号,并且进入个人中心。2. 看到页面左侧菜单栏,点击后面的加号。**具体步骤如下:**原创 2023-10-21 09:53:26 · 1372 阅读 · 0 评论 -
Umi3实战教程
umi是蚂蚁金服的前端开发框架,它内置了路由、web/移动端UI库、数据流、权限控制、常用hooks库、构建、部署、测试、等等一些工具,几乎涵盖了正常前端开发要用到的所有工具。原创 2023-10-17 19:43:15 · 1347 阅读 · 0 评论 -
【Monorepo实战】pnpm+turbo+vitepress构建公共组件库文档系统
Monorepo架构可以把多个独立的前端系统放到一个仓库中去进行联调,这里记录基于pnpm中workspace功能,如何构建将vitepress和组件库进行联调,并且使用turbo进行任务顺序编排。原创 2023-10-09 16:57:55 · 1605 阅读 · 0 评论 -
CMD脚本实战教程
要在 Windows 11 上编写一个自定义关机的 CMD 脚本文件,你可以创建一个扩展名为.bat或.cmd的文本文件,并在其中编写脚本。原创 2023-09-22 17:34:41 · 4690 阅读 · 0 评论 -
pnpm实战教程
使用 npm 时,依赖每次被不同的项目使用,都会重复安装一次。而在使用 pnpm 时,依赖会被存储在内容可寻址的存储中。原创 2023-09-14 16:26:54 · 3090 阅读 · 0 评论 -
Vite和Webpack如何使用CDN包
为了精简打包输出的dist目录大小,我们可以引入CDN外部包的方式,来缩小打包的体积,加快打包速度。这里介绍Vite和Webpack中如何引入。原创 2023-09-07 20:39:18 · 1159 阅读 · 0 评论 -
Axios使用AbortController取消请求
支持同时取消多个请求。原创 2023-09-02 14:08:15 · 417 阅读 · 0 评论 -
使用pnpm workspace管理Monorepo架构
pnpm代表(高性能的npmn),同npm和yarn,都属于javascript包管理安装工具,它较npm和yarn在性能上得到很大提升,被称为快速地,节省磁盘空间的包管理工具。默认情况下,如果可用的 packages 与已声明的可用范围相匹配,pnpm 将从工作区链接这些 packages。例如, 如果bar引用并且foo@1.0.0存在工作区,那么pnpm会从工作区将foo@1.0.0链接到bar。但是,如果bar的依赖项中有,而foo@2.0.0。原创 2023-08-19 17:39:04 · 5274 阅读 · 0 评论 -
webGL编程指南实战教程
顶点着色器是GPU渲染管线上一个可以执行着色器语言的功能单元,具体执行的就是顶点着色器程序,webgl定点着色器程序在javascript中一字符串的形式存在,通过编译处理后传递给顶点着色器执行。片元着色器和顶点着色器一样是GPU渲染管线上一个可以执行着色器程序的功能单元,顶点着色器处理的是逐顶点处理顶点数据,片元着色器是逐片元处理片源数据。下面,我们在上面绘制多个点的案例基础上,改用缓存对象来实现,并且鼠标点击制作坐标收集保存,不做渲染,点击渲染按钮时,一次性对缓冲区中的顶点数据做渲染。原创 2023-03-05 11:37:26 · 2194 阅读 · 0 评论 -
怎么使用Web Workers提升性能?
Web Workers 使得一个Web应用程序可以在与主执行线程分离的后台线程中运行一个脚本操作。这样做的好处是可以在一个单独的线程中执行费时的处理任务,从而允许主(通常是UI)线程运行而不被阻塞。它的作用就是给JS创造多线程运行环境,允许主线程创建worker线程,分配任务给后者,主线程运行的同时worker线程也在运行,相互不干扰,在worker线程运行结束后把结果返回给主线程。这样做的好处是主线程可以把计算密集型或高延迟的任务交给worker线程执行,这样主线程就会变得轻松,不会被阻塞或拖慢。原创 2023-03-02 23:26:17 · 716 阅读 · 0 评论 -
uni-app实战教程
开发工具:HBuilderX跨段框架(uniapp以对齐微信小程序api的形式封装了一套跨端框架,可以横跨10个不同的小程序平台)HTML5+ (支持原生ios,android)云开发。原创 2023-02-16 22:30:25 · 2980 阅读 · 0 评论 -
微信小程序开发教程
打开开发者工具,用微信扫码进入创建页面,填写配置如下:需要注意的是:AppId可以选择已经注册的账号Appid,也可以选择测试号。区别是测试号不支持云开发。这里暂时选择测试号。完成配置后,点击底部确定按钮,然后会进入一个初始化的页面,第一次打开可能有些慢,耐心等待即可;原创 2023-02-16 00:46:15 · 4010 阅读 · 0 评论 -
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 · 7769 阅读 · 1 评论 -
TypeScript基础教程
JS已有类型和TS新增类型。原始类型:string、number、boolean、null、undefined、symbol对象类型:object(数组、对象、函数等对象)TS新增类型联合类型、自定义类型(类型别名)、接口、元组、字面量类型、枚举、any等。原创 2022-09-25 02:33:22 · 4608 阅读 · 0 评论 -
乾坤实战教程
● qiankun 是一个基于 single-spa 的微前端实现库,旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。● 使用简单○ 技术栈无关,任意技术栈的应用均可 使用/接入,不论是 React/Vue/Angular/JQuery 还是其他等框架。○ HTML Entry 接入方式,让你接入微应用像使用 iframe 一样简单。● 功能完备:几乎包含所有构建微前端系统时所需要的基本能力。○ 样式隔离,确保微应用之间样式互相不干扰。原创 2022-09-07 20:08:53 · 1077 阅读 · 0 评论 -
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 · 5019 阅读 · 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 · 1708 阅读 · 0 评论 -
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 · 1489 阅读 · 0 评论 -
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 · 164 阅读 · 0 评论 -
vue利用渲染函数创建弹窗组件,完美支持传值和事件监听(Vue2.X)
弹窗组件和其他组件不同,在页面初始化的时候,页面dom结构中是不存在弹窗组件的div节点,只有在调用时弹窗组件的div在会被动态的添加到页面中,并且当删除时,也需要在页面中删除;结合弹窗组件的使用场景,比较合适的实现是使用createElement渲染函数,渲染函数可以动态的创建组件,并且通过props、on属性,传入组件的标题、内容,监听组件的事件;观察看下面这段代码: const vm = new Vue({ render: h => { .原创 2021-08-24 12:46:03 · 3305 阅读 · 0 评论 -
cURL安装和常用实例
cURL是一个利用URL语法在命令行下工作的文件传输工具,配置后,可以在命令行直接执行各类操作,也可以作为源码包,载入到各类后端开发,为后端提供文件传输能力;安装下载演示电脑是win10 64位,下载对象的包,下载地址配置环境变量这里下载下来的文件有的不是zip格式,找下下载个zip的包,解压后,内部文件如图:配置环境变量:新建CURL_PATH系统变量;编辑PATH,加上这两行(具体路径根据curl包实际路径填写):%CURL_PATH%\I386C:\Program.原创 2021-08-22 13:14:36 · 737 阅读 · 0 评论