- 博客(84)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 原生小程序开发如何使用 tailwindcss
在日常的工作开发中，我们常常会遇到这样的场景:公司或团队内部，需要开发和共享一些 逻辑/UI 组件等等的代码，但是这些代码里面，可能包含一些敏感信息或专有功能，我们不想发布到公开的npmjs上去。这时候我们就需要去搭建npm私有源，让这些包只在我们公司内部分享。那这时候Verdaccio就是一个方便的选择。Verdaccio是一个轻量级的私有npm仓库管理工具，它可以帮助我们搭建自己的私有 npm 源。
2024-05-14 23:08:19
986
原创 使用 Verdaccio 私有化 npm 源指南
在日常的工作开发中，我们常常会遇到这样的场景:公司或团队内部，需要开发和共享一些 逻辑/UI 组件等等的代码，但是这些代码里面，可能包含一些敏感信息或专有功能，我们不想发布到公开的npmjs上去。这时候我们就需要去搭建npm私有源，让这些包只在我们公司内部分享。那这时候Verdaccio就是一个方便的选择。Verdaccio是一个轻量级的私有npm仓库管理工具，它可以帮助我们搭建自己的私有 npm 源。
2024-04-14 16:45:39
1436
原创 macOS搭建php环境以及调试Symfony
经过这么多年的发展，早就已经非常的成熟了。的同学，看到这个结果，不免会心一笑，弱类型解释型之殇哈哈。的时候，一定要买大点的内存，尤其是你要本地跑容器的，推荐。不懂这个梗的，可以去浏览器的开发者工具控制台，执行一下。这首歌，于是一边写代码写这篇文章，一边开始了我的。早已经了然于胸，不都是这些玩意，或者那些架构嘛…啥的，我个人感觉是没有必要的，因为这种都可以使用。字符串，这种代码实在是太常见了，各个语言的。不知不觉就水了这么长的文章了，看都看累了。说远了，我们注册了这个路由之后，访问。
2024-03-30 23:38:25
1739
原创 unocss 究竟比 tailwindcss 快多少？
我们知道unocss很快，也许是目前最快的原子化CSS引擎 (没有之一)。unocss解释它为什么这么快的原因，是因为它不用去解析CSS抽象语法树，直接在content里面通过正则表达式从内容中提取token，然后生成样式。这点从unocss可以看到unocss比快3.7倍左右。其中官方的unocss测试素材，使用的是vite测试素材则是vitepostcss。可是假如我们以vitewebpack插件的方式去使用unocss的话，默认是不支持那些@apply@screentheme()这些CSS。
2024-03-05 20:00:15
1934
原创 记录一次自己的服务器迁移过程
最近阿里云发动了史上最大力度价格战，自称平均降价超20%。而我，作为一只哪家便宜，就买哪家的三姓家奴。趁着降价，悻悻然又买了一台阿里云ECS，计划用来承接自己一台快过期的华为云 HECS的服务。幸运的是，我这个服务里面，所有的组件早已容器化，业务镜像也早已经使用了私有镜像仓库，所以迁移起来还是很容易的。让我们立刻开始吧！
2024-03-03 22:35:57
1270
原创 使用 postcss-cva 来生成 cva 方法吧
cva全称为, 它是一个非常适合制作那种，创建控制Css变体方法的类库，它非常的契合像这类的原子化思想。在很多时候我们自己封装组件, 尤其是使用原子化思想去编写css, 然后去封装组件，用它就对了！
2024-02-01 16:18:01
1186
原创 我可能是全中国最了解 tailwindcss 的开发者
我热爱并经常使用它, 我也非常喜欢daisyui, 使用这2者进行开发为我节省了不少功夫。然而遇到项目上的一些场景，需要深度定制Css UI组件，这时候daisyui暂时无法解决我的问题。于是我产生了一些想法，并以和daisyui为灵感，编写了 icestack这是一个Css UI框架的生成和管理工具，通过它，你可以很容易的对样式进行扩展，也可以很容易的从0开始构建你自己的Css UI并结合来进行使用！让我们看看如何来使用它吧！
2024-01-03 14:28:27
932
原创 我可能是全中国最了解 tailwindcss 的开发者
首先，我要对起这样的标题感到抱歉，本来想起一个"我的2年开源之旅"这样的标题，但是我知道，这种标题太普通，肯定就没啥人感兴趣看，就像我写的大部分文章一样。于是索性做了一回标题党(坏笑～)。不过这个标题也不是空穴来风，我也确实比较了解实际上现在回过头想想，自己不过只是做了一件很小的事情，我的那些开源项目又不是那种有开创性的全新项目，而是寄宿于某一个生态，跟着生态潮涨潮落，早晚有一天会被遗弃。不过这段旅程中，我各个方面还是收获了很多，起码我再去面试的时候，人家问我懂不懂ast，写不写plugin。
2023-12-15 22:46:48
557
原创 用 @icestack/ui 构建适配微信小程序的 daisyui
daisyui是中最流行的纯CSS框架，然而它作用的平台只有h5，直接在小程序中使用会报错，因为小程序的CSS选择器有很多限制，无法像h5那样自由。那么怎么样才能构建出适配小程序版本的daisyui呢？
2023-12-01 17:07:24
1481
原创 使用tailwindcss来构建以及引入外部组件
我们在日常的开发中，经常会去使用和封装各种各样的组件库。有些是开源的，第三方开发的UI库，有些是我们开发人员给自己的特定的业务封装的UI库。其中很多情况其实是以流行的开源UI库(或者fork的改版)自己封装的业务组件为主的开源UI库它们的样式相对来说是独立于整套系统的，比如它们的样式都是ant-el-开头的，一般引入之后不会和原先系统里的样式产生冲突。而自己封装的业务组件，由于往往和系统高度绑定也没有这样的问题。那么如何用来构建/发布和引入自己封装的业务组件呢？
2023-10-07 18:05:39
1180
原创 动态调整系统主题色(4): CssVar 与 Variant 方案的探索
这篇已经是动态调整系统主题色的第四篇了，转眼距离第一篇发布已经过去了2年的时间。随着时间的流逝，对技术的理解也在不断的进步，方案也在不断的完善和推陈出新，本篇文章就是在探讨系统主题色的2方案:CssVar和Variant。假如你没有看前面三篇文章的话，初看到这2个词可能不能直观的知道它们是什么意思，下面我先简单介绍一下它们是什么以及它们的原理。
2023-10-06 11:46:56
794
原创 更灵活的 serverless framework 配置文件
再经过前置教程的部署之后，不知道你有没有注意这样一个问题，就是我们部署的函数名，以及API网关的endpoint，它们的名称和路径都带一个dev?这个就是stage导致的了，我们执行sls deploy部署的时候，由于没有指定--stage的参数，导致它默认就是dev，所以我们之前部署的函数名称，网关里面都带它。那么它有什么作用呢？实际上这个值就是用来给你的函数，以及对应的服务去区分阶段/环境的。比如我们一个提供webdevsitprod不同的环境，它们各自的API网关分配的endpoint。
2023-09-08 17:35:22
156
原创 lambda nodejs 函数降低冷启动时间的最佳实践
serverless 降低冷启动时间的探索 - 服务端打包 node_modulesNodejs云函数冷启动时间的优化2篇文章的作者:ice breaker2首先在看这篇文章之前，我先必须给你介绍一个概念，就是冷启动时间。这个特性各个服务商的serverless云函数都存在，这个和函数容器的生命周期息息相关。以LambdaInit。
2023-09-07 17:36:19
222
原创 typescript 支持与本地调试
在上一章节，我们创建了一个函数，并把它顺利的部署到了AWS云上。然而真正上生产的函数项目肯定不会这么简单。对于一个现代的nodejs项目来说，我们还有许多的需求：比如我们也更想使用typescript来进行开发，还有我们也需要在本地搭建一套完整的模拟环境，来对我们编写的代码进行调试和测试。比如我们要添加对应的单元测试和CI/CD又或者是我们的函数里面，各种第三方的依赖项的处理，js相关的还好，但是其他那些和平台绑定的二进制文件，又或者是内置的.xdb等等一些数据文件，应该如何处理呢？请听我娓娓道来.
2023-09-05 13:20:04
231
原创 Serverless Framework 亚马逊云(AWS)中国地区部署指南
是业界非常受欢迎的无服务器应用框架，开发者无需关心底层资源即可部署完整可用的 serverless 应用架构。Serverless Framework 具有资源编排、自动伸缩、事件驱动等能力，覆盖编码-调试-测试-部署等全生命周期，帮助开发者通过联动云资源，迅速构建 serverless 应用。目前默认支持, 同时也是支持最好的云服务商是亚马逊云(AWS)，亚马逊云在中国地区,目前主要服务企业用户，而且只开放了宁夏和北京2个地域，基础设施方面分别属于西云数据和光环新网。幸运的是亚马逊也给中国这2。
2023-09-05 13:19:25
911
原创 小程序 CSS-in-JS 和原子化的另一种选择
之前我们写tarojs的应用的时候，想用CSS-in-JS解决方案，就使用社区方案里推荐的linaria, 这里我推荐另一种解决方案pandacss。pandacss是个优秀的CSS-in-JS编译时框架，相比linaria，它的配置更加简单，智能提示好，开发者体验也更好。而且它也吸收了许多的优点，我们可以自由的配置我们的主题与样式，且原子化的类名也更容易进行自由组合。就是让你在小程序开发中使用它。
2023-08-16 11:10:23
589
原创 使用 `tailwindcss-patch@2` 来提取你的类名吧
当然也不是只是给你看看的。你可以对它进行一些分析，而我是把它作为我。也是 tailwindcss-mangle。版本，主要添加了一个配置文件读取和工具类名提取额功能。目前我只是提取了所有的工具类，实际上可以获取。生成的工具类，具体的使用方式就看下篇文章吧。的方式，来为这个项目添加更多的功能，默认情况下，执行成功后会有一个。本身是一个混淆工具，用来混淆。让我们来看看怎么使用它吧。当然，你可以通过配置文件。项目重要的组成部分。的数据文件来使用的。选择你喜欢的包管理器。
2023-08-15 19:28:26
377
原创 Panda 编译时原子化 CSS-in-JS 框架的跨平台方案
这2种CSS-in-JS方案各有它们出彩之处。目前我倾向于pandacss，只因linaria实在是太hack了!它的css模板字符串，有自己的语法，有自己的词法分析器，就像在创造一个，真是太复杂了！但是它非常值得研究！另外pandacss一个优势就是，它不会去修改我们的源代码，这带来了更少的出错的可能性，而本人在使用linaria的时候，配置稍复杂就有fatal的可能，这就需要我们花更多的时间去修复它。
2023-07-31 09:57:58
193
原创 本地环境安全访问公有云资源的一种方式
在那个网络里，再配置复杂的密码，放开额外的端口暴露在公网上，显然这就比上面直接暴露数据库要安全一点，因为这种方式相当于加了一层保护壳。把它作为我们本地环境和云上环境的桥梁，让我们本地可以快速安全的访问到云上的资源，同时云上的资源也不需要暴露在公网上。就可以直接连接线上的数据库，访问线上的缓存，队列等等系统了。在使用过程中，如果遇到问题，或者你有好的意见和建议，欢迎与我讨论。等等资源暴露在公网上是非常不安全的，即使你设置了复杂的密码。，就可以访问对应的资源了，这些资源，你甚至可以直接监听。
2023-07-21 09:15:20
112
原创 为什么个人项目我更推荐使用Caddy?
最近我把自己一些项目里面的nginx换成了caddy，运转相当良好，比较开心，所以写了这篇文章，也推荐给大家使用。Caddy。
2023-06-25 10:03:09
1597
原创 tailwindcss 多上下文与独立分包
独立分包是小程序中一种特殊类型的分包，可以独立于主包和其他分包运行。从独立分包中页面进入小程序时，不需要下载主包。当用户进入普通分包或主包内页面时，主包才会被下载。独立分包属于分包的一种。普通分包的所有限制都对独立分包有效。独立分包中插件、自定义组件的处理方式同普通分包。独立分包中不能依赖主包和其他分包中的内容，包括 js 文件、template、wxss、自定义组件、插件等（使用 分包异步化 时 js 文件、自定义组件、插件不受此条限制）主包中的app.wxss。
2023-06-20 11:49:27
232
原创 深入理解CSS字符转义行为
在日常的开发中，我们经常写css。，我们往往写出这样的样式.btn {} }这时候就纳闷了，我明明写的是啊？这个转义还好说，\3这个又是哪来的呢？本篇文章就来从W3C的角度，对css转义行为进行揭秘。css。
2023-06-12 10:46:20
997
1
原创 符合国情的supabase私有化部署(0)
关注技术前沿的我们，想必对BaaS都不陌生。从Firebase横空出世，再到2014年的一声炮响。它已经给全世界开发者，带来了大量便捷的，开箱即用的开发运维环境，加上它优秀的开发体验。这让我们程序员们能够以很少的人力成本，做出功能丰富的应用。然而出于众所周知的原因，它在我们国内是无法使用的。于是利用这信息不对称的效果：国内一批独立的公司还有一些大厂，对Firebase这个产品进行"借鉴" 从而做出了自己的XXbase。比如某里云的XXX，某讯云的XXX，还有xxCloud的XXX，等等。
2023-05-31 12:48:53
1323
原创 利用Github Action备份Docker容器中的数据库
数据很重要，所以我们要经常备份。那么怎么备份呢？假如我们使用云厂商的数据库，里面已经自带了快照和备份功能了，只要你愿意花钱，就能帮你解决大部分技术问题。它们这些数据库往往是部署在单独一/多台主机实例上，不会放在容器里去跑。为什么？俺也不是专业的运维，俺也不知道。这里给个知乎链接作为参考对于我们个人项目而言，一般不会去购买昂贵的数据库实例，往往云主机容器部署serverlessoss/cdn就能满足绝大部分开发的需求了。很多时候简单的就够用了，然后再加个开源的BAASsupabase。
2023-05-15 10:05:10
218
1
原创 一个混淆Tailwindcss类的工具
是一个原子类优先的css框架，现如今非常的流行。它语义化的类名能够让前端开发人员直观地对元素的样式进行编写和维护。然而这种直观性，有时候也会带来一定的困扰。有时候我们不想让用户或者外界的开发人员也能直观的观测到所有元素的样式，比如我们访问 https://tailwindcss.com , 然后打开开发者工具，检查元素。瞬间，页面上那些元素的排版和样式都能猜测出来，甚至都不需要看右边的style面板。所以，出于让其他人在生产环境中无法直观的看出一个元素的样式，我们就需要对生成的原子类进行混淆。
2023-05-05 09:23:40
343
原创 Graphql中我们应该用什么姿势来实现Resolver?
我最近在用Graphql来弥补原先写的RESTFUL接口的一些短板。在实践过程中遇到了一些思考，借着文章抛砖引玉，分享给大家。为了让大家更好的理解本文的思想，我搞了一个简单的案例，源码见附录。首先我们把ER图，变成即为：于是就能直接粗略的把SDLid: Int!tags: [Tag!user: User!id: Int!user: User!id: Int!id: Int!接下来我们就开始定义Query和。
2023-04-25 10:00:00
524
原创 这可能是小程序使用 tailwindcss 开发的最佳方案
remrpx笔者对的理解还算比较到位，也写了不少的presetplugin和许多的postcss插件。最近这个月，我发布了的2.x版本，与之前的版本相比，大大增强了我们开发者的开发体验，尤其是类jsx框架相关的体验。接下来，让我们快速开始吧！
2023-03-28 14:45:33
586
原创 # 技术详解: 利用CI同步文章以及多端发布
前几天我更新了一篇简单技术总结之后，不少人都对里面的技术细节感兴趣，问我具体是怎么实现的?于是为了给群友答疑解惑，接下来陆续会聊聊我自己的实现，这篇文章的这个方案已经运行了很多年了，很久没有更新，居然有一天会被人问到，也是比较欣喜的。当然，出于自身水平的限制，目前肯定有更好的方案，所以也欢迎提出建议和意见。这个问题第一眼，我们可能会想到这样的解决方案：这些信息可以体现在文件的名称上呀！比如我们写了一篇文章，文件名叫如何让霸道富婆爱上我_20230302_520_true.md。
2023-03-03 11:47:51
382
原创 3月来了,给自己做一个简单的nodejs后端技术总结
我又滚回来写文章了，从去年11月底到今年2月底，算起来整整1/4年没有写博客了，自己的博客站都长满了坟头草，我在上面跳舞。在这3月来临之际，我们还是来聊聊技术，就当给自己做个阶段性总结。
2023-02-28 21:36:23
793
原创 动态调整web主题(3): 基于tailwindcss插件的主题色生成方案‘
续接[动态调整web系统主题?看这一篇就够了]与[动态调整web主题(2) 萃取篇]笔者一直在思索这个解决方案，更加简单的使用方式，更加流畅的开发者体验。于是在之前的基础上，添加了的使用方式，同时也完善了选择器切换和智能提示，接下来就来介绍一下，如何使用吧。一种基于的模式的动态多主题色快速生成，和管理方案。
2022-09-26 10:44:26
1525
1
原创 如何利用 promise 影响代码的执行顺序？
我们写代码的时候，经常会遇到这样的场景。2个不同组件，它们的生命周期本身都是相互独立，毫无关联的，但是它们调用的接口，存在相互依赖的情况。我举个例子：开发小程序时候，里面App有一个onLaunch的hook，在小程序初始化时调用，而Page里也有一个onLoad的hook，在页面加载时被调用。但是，我们往往也经常遇到这种case现在问题来了，依据上面的执行顺序，getToken和请求实际上是并发执行的。而我们的预期是，先执行getToken并设置好全局token值之后，才调用。
2022-09-19 22:41:00
512
原创 优化 Serverless Nestjs 冷起动时间
本文主要介绍的是如何减小部署包的体积，从而减少冷启动时间。在方式上，其实各个Nodejs框架优化冷启动的方式都差不多，这样的方案完全可以无缝同步到其他的框架中，我们只需要选择自己喜欢的打包工具即可。Nestjs默认支持使用webpack进行打包，只需在nest-cli的参数中配置--webpack默认使用根目录下的这样就大大减小了npm包的体积，从而加快了部署和冷启动的速度。这个配置，和官方提供的有些不同，主要是因为官方的场景主要在国外的云厂商，而这个配置是针对阿里云，腾讯云进行配置的。...
2022-08-16 00:44:14
433
原创 在 HBuilderX 中使用 tailwindcss
之前我写了一个weapp-tailwindcss-webpack-plugin来兼容uni-app,taro等等各个框架，不过那时候提供的demo都是cli版本的。最近社区里有同学问我，HBuilderX要如何使用？今天就给大家带来HBuilderX中vue2和vue3各自的的使用方法。...
2022-07-31 14:45:08
1435
3
原创 如何调试JS中鼠标悬停事件影响的元素？
鼠标悬停俗称hover，它会在鼠标指针悬停在被选元素上时触发。一般前端开发会利用css中的hover伪类选择器，来给被选元素应用不同的样式，从而增强用户的体验感。最常见的例子就是Button。
2022-07-21 10:19:07
3388
原创 在 Nuxt3 中使用 Font Awesome 图标
Font Awesome 是世界上最流行和最易用的图标库，让我们在 Nuxt3 中使用它吧。首先我们安装 Font Awesome 图标库核心：图标库接着我们安装所有的免费的图标：当然，如果你使用的是 版本的 ，想使用完整的图标库，可以见此处。由于 Nuxt3 是 vue3 版本语法，所以我们安装时必须使用:到此所有的 Font Awesome 包都安装完成了，接下来我们开始在 Nuxt3 中使用。在 应用的项目的 目录内，添加一个文件 写入内容:保存后重新启动，这样这个 会被自动的注册到
2022-07-11 10:15:46
820
原创 令人愉快的 Nuxt3 教程 (二): 快速轻松地搭建博客
继 令人愉快的 Nuxt3 教程 (一): 应用的创建与配置 后，我们已经成功的创建了一个 应用，同时已经添加了大量的开发配置。有道是 。接下来本文章将通过快速的搭建一个博客系统来学习 。各位开发者们看到这里也不用觉得害怕，因为这项工程，在众多现成的 包加成下，已经变的非常的简单了。本章节将会主要使用 团队打造的 ，它可以便捷的搭建一个内容管理系统。和那些 / 快速部署静态网站的生成器不同， 它只为我们提供了一套 文件的渲染的机制，和围绕它进行一些数据交互的 和组件，因此这个方案自定义程度很高。现
2022-07-07 23:27:37
2008
原创 令人愉快的 Nuxt3 教程 (一): 应用的创建与配置
笔者从 开始接触这个框架，当年的选型，也主要因为它提供了开箱即用的 方案。当然，项目开始这一路走来，遇到的坑非常的多。不过相对于的技术收获也是很大的，因为我们不得不在这趟旅程中，接触许多平常未曾涉及的知识体系，这些对我们前端开发而言，大有裨益。接下来，笔者也将用通俗易懂的文字和图片，带你进入 的世界。 对于 就如同 对于 。它们产生的原因，主要是因为像 , 它们都只是视图层的框架。然而前端应用，从代码编写到最终的真正上线，还要经过一系列流水线师的构建步骤。比如在 中一个 文件就要经过 分发
2022-06-29 10:02:04
4050
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人