🔥强烈推荐
1 phind 开发者专属的搜索引擎
Tip: 需要“魔法”才能访问
试用了一下还是不错的,会自动总结检索文章中的内容,并把内容来源都详细列举了出来(比baidu的开发者搜索强不少)
下面看2个案例
① 实现毛玻璃效果
② 查看端口占用情况
2 magicast - 优雅的AST操作工具
antfu
大佬参与的又一佳作
基于 recast
和 babel
实现,允许以编程方式修改 JavaScript
和 TypeScript
的源代码,操作AST更加优雅
来看看官方示例
config.js:
export default { foo: ["a"], };
修改源码,往foo
里插入一个值b
import { loadFile, writeFile } from "magicast"; const mod = await loadFile("config.js"); // 就像常规的对象插值一样 mod.exports.default.foo.push("b"); await writeFile(mod);
更新后的 config.js:
export default { foo: ["a", "b"], };
这种库可以用到一些需要修改源码的插件中,或者自动化重构代码的场景(需要操作AST)
3 Warp - 21世纪的终端工具
最近被安利的一个Terminal工具(还是挺好用,但目前只支持Mac)
打开速度非常的快(完全基于Rust构建,不参杂WEB技术)
我们先看看官网
再看看有哪些 "开箱即用的特色功能"
① 编辑体验
支持鼠标在任意位置操作,也可通过快捷键 快速的跳转与内容选取
② 搜索与补全
支持内容搜索,开箱即用的命令补全与纠错
③ AI加持
每日免费100次的 chatGPT
提问
了解更多功能推荐去看官网的介绍视频
🔧开源&技术资料
4 vue-reuse-template - 允许模板里定义可重用的模板
antfu
的又一花活,类似于使用 defineComponent
直接定义组件
大概用法如下
<script setup> import { createReusableTemplate} from 'vue-reuse-template' const [DefineTemplate, ReuseTemplate] = createReusableTemplate() </script> <template> <DefineTemplate v-slot="{ data, msg, anything }"> <div>{{ data }} passed from usage</div> </DefineTemplate> <ReuseTemplate :data="data" msg="The first usage" /> <ReuseTemplate :data="anotherData" msg="The second usage" /> <ReuseTemplate v-bind="{ data: something, msg: 'The third' }" /> </template>
目前这个能力已被集成到 VueUse v10 里
5 深度使用html2canvas的经验总结
"本文主要关注 html2canvas 的前端生成方案,作者把在其中学习到的思路和踩坑经验和大家分享下,帮助大家上线顺利,享受美好的周末"
6 Node.js事件循环可视化指南
视野修炼-技术周刊第33期(2):https://developer.aliyun.com/article/1395134