# 1. 新建 src/typings.d.ts（在 src 文件夹下新建）

// 声明 window 上自定义属性，如事件总线

declare interface Window {

  eventBus: any;

}

// 声明.vue 文件

declare module "*.vue" {

  import { DefineComponent } from "vue";

  const component: DefineComponent<object, object, any>;

  export default component;

}

提示：遇到 ts 报错，有些时候是配置未生效，可以重启 vscode 或 ts 服务（vscode 快捷键 ctrl+shift+p 调出命令行，输入 Restart TS Server）

在 UnoCSS 的官网首页，已经为我们展示了它的优点

1. 没有核心实用程序。所有功能均通过预设提供。
2. 瞬间。无需解析、无需 AST、无需扫描。它比 Windi CSS 或 TailWind JIT 快 5 倍。
3. 轻量级。零 deps 和浏览器友好：~6kb min+brotli。
4. 丰富的集成。一流的 Vite、Webpack、PostCSS、CLI、VS Code、ESLint 等支持。
5. 快捷方式。动态地对实用工具进行别名或分组。
6. 属性模式。将实用工具分组放置在属性中。
7. 纯 CSS 图标。使用单个类名作为任意图标。
8. 变体组。使用常见前缀的快捷方式来组合实用工具。
9. CSS 指令。使用 @apply 指令在 CSS 中重用实用工具。
10. 编译模式。在构建时将多个类合成为一个类。
11. 检查器。交互式地进行检查和调试。
12. CDN 运行时构建。使用一行 CDN 引入代码即可使用 UnoCSS。

如上已经说的很全面了，UnoCSS 的设计理念是简洁易用，提供了一套直观和易于记忆的类名，使得开发人员能够快速编写和理解样式代码。它遵循类似于 Tailwind CSS 的风格，使用直观的命名规则来描述样式的作用。而且 Antfu 大佬也是 Tailwind 的作者之一。

# 值解析

• "off" or 0 - 关闭规则
• "warn" or 1 - 将规则视为一个警告（不会导致程序退出）
• "error" or 2 - 将规则视为一个错误 (当被触发的时候，程序会退出)

ESLint 从 v8.53.0 起，将弃用代码风格相关规则，代码风格校验应该交由 Prettier 处理，如果你不喜欢 Prettier ，那么要注意尽量使用 v8.50.0 之前的版本。

本文不谈代码风格的那些规则，只提及可以提高代码质量、减少运行时出错的的规则。

# 问题描述

在某一次更新 prettier 插件后，发现格式化不起作用了，在 vscode 用户配置中怎么设置都没有效果

官方地址： https://parceljs.org/getting_...

Parcel 是 Web 应用打包工具，适用于经验不同的开发者。它利用多核处理提供了极快的速度，并且不需要任何配置。

# 特性

• 零配置： Parcel 不需要配置文件，它会自动识别和配置项目中的文件，简化了构建过程。
• 快速： 使用多核处理器并行地构建项目，提高了构建速度。
• 支持多种文件类型： Parcel 可以处理各种前端资源文件，无需手动配置 loader。
• 在需要的时候自动使用 Babel、PostCSS 和 PostHTML 自动转换模块，甚至是 node_modules。
• 内置支持模块热替换。
• 友好的错误记录体验，语法突出显示的代码帧有助于查明问题。

# gsap

GSAP （GreenSock Animation Platform）是一个用于创建 高性能、跨浏览器 的动画的 JavaScript库 。它提供了许多强大而灵活的 API，允许开发者创建各种复杂的动画效果。

以下内容是个整体功能的描述，不会对所有 api 进行说明讲解，主要是关键性内容描述。

# 前言

作为一个前端开发，不可避免地需要开发动画。如果自己临时写一个动画，还是比较容易出问题的，今天介绍一个很好用的动画库，功能十分强悍 ———— GSAP。

# 效果

说再多，也不如直接来效果来的直观。
如果能科学上网可以查看以下官网链接：

1. GSAP 动画：greensock.com/showcase/
2. GSAP ScrollTrigger（gsap 的插件）动画：greensock.com/st-demos/