摘要: 本文为Varlet组件库源码主题阅读系列第六篇,Varlet支持自定义主题及暗黑模式,本篇文章我们来详细看一下这两者的实现。 主题定制 Varlet是通过css变量来组织样式的,什么是css变量呢,其实很简单,首先声明自定义的css属性,随便声明在哪个元素上都可以,不过只有该元素的后代才能使用,所以 阅读全文
posted @ 2022-10-19 21:12 街角小林 阅读(114) 评论(0) 推荐(0) 编辑
摘要: 本文为Varlet组件库源码主题阅读系列第五篇,读完本文你可以了解到如何通过编写一个Vite插件来支持使用md文件直接作为路由组件。 之前文档站点的搭建里我们介绍了路由的动态生成逻辑,其中说到了文档是使用Markdown格式编写的,并且还直接在路由文件里使用md文件作为路由组件: 路由就是路径到组件 阅读全文
posted @ 2022-10-16 20:34 街角小林 阅读(103) 评论(0) 推荐(0) 编辑
摘要: 本文为Varlet组件库源码主题阅读系列第四篇,读完本篇,可以了解到如何使用Vite的Api接口来启动服务、如何动态生成多语言的页面路由。 Varlet的文档网站其实就是一个Vue项目,整体分成两个单独的页面:文档页面及手机预览页面。 网站源代码文件默认是放在varlet-cli目录下,也就是脚手架 阅读全文
posted @ 2022-10-10 22:53 街角小林 阅读(200) 评论(0) 推荐(0) 编辑
摘要: 本文为Varlet组件库源码主题阅读系列第三篇,读完本篇,你可以了解到如何将svg图标转换成字体图标文件,以及如何设计一个简洁的Vue图标组件。 Varlet提供了一些常用的图标,图标都来自 Material Design Icon。 转换SVG为字体图标 图标原文件是svg格式的,但最后是以字体图 阅读全文
posted @ 2022-10-09 22:39 街角小林 阅读(90) 评论(0) 推荐(0) 编辑
摘要: 本文为Varlet组件库源码主题阅读系列第二篇,读完本篇,你可以了解到如何将一个Vue3组件库打包成各种格式 上一篇里提到了启动服务前会先进行一下组件库的打包,运行的命令为: varlet-cli compile 显然是varlet-cli包提供的一个命令: 处理函数为compile,接下来我们详细 阅读全文
posted @ 2022-10-08 21:52 街角小林 阅读(1741) 评论(0) 推荐(0) 编辑
摘要: 本文为Varlet组件库源码主题阅读系列第一篇 Vue开源的组件库有很多,基本各个大厂都会做一个,所以作为个人再重复造轮子其实意义也不是很大,但是笔者对于如何设计一个Vue组件库还是挺感兴趣的。 不同的组件库架构肯定有所不同,不过大体思路应该都差不多,笔者在众多组件库中挑选了Varlet 来进行剖析 阅读全文
posted @ 2022-10-07 15:20 街角小林 阅读(120) 评论(0) 推荐(0) 编辑
摘要: 上一篇Vite入门从手写一个乞丐版的Vite开始(上)我们已经成功的将页面渲染出来了,这一篇我们来简单的实现一下热更新的功能。 所谓热更新就是修改了文件,不用刷新页面,页面的某个部分就自动更新了,听着似乎挺简单的,但是要实现一个很完善的热更新还是很复杂的,要考虑的情况很多,所以本文只会实现一个最基础 阅读全文
posted @ 2022-09-14 21:01 街角小林 阅读(87) 评论(0) 推荐(0) 编辑
摘要: Vite是什么就不用笔者多说了,用过Vue的朋友肯定都知道,本文会通过手写一个非常简单的乞丐版Vite来了解一下Vite的基本实现原理,参考的是Vite最早的版本(vite-1.0.0-rc.5版本,Vue版本为3.0.0-rc.10)实现的,现在已经是3.x的版本了,为什么不直接参考最新的版本呢, 阅读全文
posted @ 2022-09-13 23:10 街角小林 阅读(118) 评论(0) 推荐(0) 编辑
摘要: 上一篇我做了一个在线白板!给大家介绍了一下矩形的绘制、选中、拖动、旋转、伸缩,以及放大缩小、网格模式、导出图片等功能,本文继续为各位介绍一下箭头的绘制、自由书写、文字的绘制,以及如何按比例缩放文字图片等这些需要固定长宽比例的图形、如何缩放自由书写折线这些由多个点构成的元素。 箭头的绘制 箭头其实就是 阅读全文
posted @ 2022-08-07 22:39 街角小林 阅读(79) 评论(0) 推荐(0) 编辑
摘要: 笔者是一个平平无奇的前端打工人,没有参与过啥热门开源项目的共建,所以每次说自己热爱开源都很心虚,充其量就是热爱使用开源项目,不过这两年来也陆续做了几个小项目,虽然只有时不时的来几个star,不过也给我安静的github平添了几分人气,本文就给大家推荐一下笔者的开源项目,如果觉得可以欢迎给个关注~ 豆 阅读全文
posted @ 2022-07-17 18:13 街角小林 阅读(244) 评论(0) 推荐(0) 编辑