本周周刊

#最前沿

ℹ️Vue 2 is Approaching End Of Life
Vue2 在 2023 年 12 月 31 日停止官方支持，后续支持交给了 HeroDev（HeroDevs 与开源作者合作，为公司提供永无止境的支持、专家咨询和废弃开源软件包的工程设计）。HeroDevs 上显示目前在支持的产品有 Vue2、Bootstrap 3/4、Angular 2-13。

ℹ️The JavaScript Oxidation Compiler
最近很火的 Lint 工具，使用 Rust 编写，自称 50x 于 Eslint。类似的还有Biome (biomejs.dev)和Ruff (astral.sh)

ℹ️A list of JavaScript engines, runtimes, interpreters
一份 JavaScript 引擎、运行时、解释器列表。

ℹ️一行代码修复 100vh bug
Chrome 108 开始新支持了 Dynamic Viewport Units（主要有 dvh、dvw 等），解决 vh、vw 没有消除浏览器工作栏的影响。此外还支持了大、小视窗。viewport-units

讨论组：@FEweekly

在逛网站看到一个比较有意思的特效，好奇是怎么实现的，现在很多网站都有这个 CSS 特效。

#鼠标跟踪发光效果

实现：https://github.com/codaworks/react-glow

原理：radial-gradien 属性 + 监听鼠标的 moverover 事件

📰 2024 第一期周刊

🆕 Vue 3.4 (代号灌篮高手)发布
新特性有
- 模板解析速度提升 2 倍 （htmlparser2）
- 更高效的反应系统（如果计算属性的 value 不发生变化不会触发响应，合并来自多个依赖的响应）
- defineModel 稳定
- v-bind 同名简写 :user="user" 可以简写为 :user
- 对水合不匹配的错误提示做了改进
- 添加了生产错误参考和编译时标志参考的文档

🛜 css-wrapped-2023
chrome developer 发布了2023年度的 CSS 封装


📢 Flex 和 Grid 学习资源

通过两个免费的游戏学习 Flex 和 Grid 布局
- https://codepip.com/games/flexbox-froggy/
- https://cssgridgarden.com

Grid 交互式指南
https://www.joshwcomeau.com/css/interactive-guide-to-grid

总结一下目前 codemod 可以使用的一些工具，进行批量修改代码的时候也许能用到：

- magicast https://github.com/unjs/magicast
- ast-grep https://ast-grep.github.io/
- fastmod https://github.com/facebookincubator/fastmod
- gogocode 不维护了，之前小程序 vue2 升 vue3 用的这个
- jscodeshift https://github.com/facebook/jscodeshift 老牌工具，没用过
这些工具都是专注于 codemod 场景做的，当然我们也可以直接用更加底层的工具，比如 babel、swc 之类的去做
相比于 find&replace，使用这种基于 AST 的工具的好处的能够基于代码结构进行更加安全的进行更改

来自投稿

#TIPS 快速生成 .gitignore

### 1. gitignore 命令行工具

gitignore 是一个命令行工具，它能够从 [GitHub’s gitignore templates](https://github.com/github/gitignore) 仓库中生成 .gitignore 文件。

#### 安装

如果你已经安装了 Node.js，可以通过 npm 安装 `gitignore`：

npm install -g gitignore

#### 使用方法

安装后，你可以使用 gitignore 命令来生成 .gitignore 文件。例如，为 Node.js 项目生成 `.gitignore`：

gitignore node

这条命令将从 GitHub 上下载最新的 Node.js .gitignore 模板并保存到当前目录。

### 2. gibo（Gitignore Boilerplates）

gibo 是另一个流行的命令行工具，用于快速生成 .gitignore 文件，它同样从 GitHub’s gitignore 模板仓库下载。

#### 安装

你可以通过 brew (macOS) 或直接从源代码安装 `gibo`：

brew install gibo

或者，使用以下命令克隆并安装：

git clone https://github.com/simonwhitaker/gibo.git ~/bin/gibo
echo 'export PATH="$PATH:$HOME/bin/gibo"' >> ~/.bash_profile
source ~/bin/gibo/gibo-completion.bash

#### 使用方法

要为特定技术栈生成 .gitignore 文件，只需运行：

gibo Node VisualStudioCode > .gitignore

这条命令会将 Node 和 Visual Studio Code 的模板合并到一个 .gitignore 文件中。

### 3. 使用 gitignore.io 的 CLI 工具

如果你经常使用 gitignore.io，在命令行中使用它也是可能的。它提供了一个 API，可以直接通过 curl 来使用：

curl -L -s https://www.toptal.com/developers/gitignore/api/node,visualstudiocode > .gitignore

这条命令将为 Node.js 和 Visual Studio Code 生成 .gitignore 文件。