本文列出了一些在工作中常会用到的、比较好用的 vite 插件。

随着 Nodejs v16 成为长期稳定支持的版本，ESM 也随之成为 NodeJs 正式支持的标准化模块系统，这允许我们通过 ESM 来开发我们的 NodeJs 项目，并在项目中通过ESM 来导入其他的ESM包。

这里收集了一些各种类型的好玩的库或者框架。

pnpm 是一款新兴不久的包管理器，相比于 npm 和 yarn，pnpm 拥有更快的安装速度，同时节约磁盘空间。

TSConfig 文件是用于表明其所在的目录是一个 typescript 或 javascript 项目的根目录。 TSConfig 文件可以是 tsconfig.json 或 jsconfig.json，它们的配置和行为相同。

在开发一些公共模块作为一个独立仓库时，有时候可能会在一个使用 es 的项目中通过 import 导入， 有可能在一个 cjs 项目中通过 require 导入。

如何实现单个仓库能够同时被 cjs 和 esm 项目导入呢？

一个简单的基于 vue3 的表单配置化生成方案，可以作为思路参考。

Docker 是一个开源的应用容器引擎，它可以将应用打包到一个可移植的镜像中，使得应用可以更轻便的部署在任意 Linux 或 Windows 的操作系统的机器上。同时还提供了环境隔离，很大程度上避免了不同环境不一致带来的各种问题。Docker可轻便移植的特性，也极大的促进了 CI/CD 的发展。

模块热替换（Hot Module Replacement） 是 webpack 的一个 十分有用且强大的 特性。 当我们对 文件代码进行修改并保存后，webpack 会重新编译打包文件代码，并将新的模块代码发送给客户端， 浏览器通过将旧模块替换为新模块，实现在浏览器不刷新的情况下，对应用进行更新。

在 NPM 安装 Electron, Puppeteer 等包时，他们会通过 postinstall 脚本下载对应的二进制文件。因为一些不得而知的原因这个过程在某些网络下可能会很慢或不可用。你可以复制以下配置至 .bashrc 或 .zshrc 中，使用 npmmirror.com 提供的二进制镜像。

HTTP-Strict-Transport-Security 简称为 HSTS，是一个 HTTP 响应头。 用于通知浏览器应该只通过 HTTPS 访问该站点，并且以后使用 HTTP 访问该站点的所有尝试都应自动转换为 HTTPS。

跨域资源共享（CORS） 是一种基于 HTTP Header 的机制。 该机制通过允许服务器标示除了它自己的 origin（域，协议和端口），使这些 origin 有权限访问加载服务器上的资源。

内容安全策略（Content-Security-Policy），简称 CSP。是一种 计算机安全标准。

主要目标是 减少和报告XSS攻击、数据注入攻击等。这些攻击手段的主要目的是盗取网站数据、网站内容污染、散发恶意软件等。

几乎所有现在浏览器都支持 CSP， 对于不支持的浏览器，则会忽略 CSP。

在现代前端中，SPA应用是一种主流的前端应用交互方案，其中，前端路由是实现SPA应用的关键技术之一。

微前端 是最近比较新兴的一个话题，它不具体指某个库某个框架，而是一个思想，一种概念，运用这种思想， 根据自身的需求，从而实现适用于自身的 微前端 。

在日常移动端前端应用开发中，经常遇到一个问题就是 1px的线在移动端 Retina屏下的渲染并未达到预期。以下总几种不同场景下的 1px解决方案。

VS Code 作为我现在工作中最常用的编辑器，也是我十分喜欢的编辑器。它强大的功能和插件系统，对我的工作提供了很多帮助和支持。将我在工作中经常使用的插件，推荐给大家。

Jenkins 是一款功能强大的应用程序，允许持续集成和持续交付项目。这里记录一些 Jenkins 使用的方法。

在web开发领域中，模板并不少见。从服务器端的模板语言，如Django、jsp等，应用十分广泛，存在了很长时间。又如前端，早期例如art(artTemplate)，以及近年来，大多数的MV*框架涌现，绝大多数在展现层使用了同样的渲染机制：模板。

在我们的web应用开发中，HTML标签为我们提供了基础的应用和交互，我们使用HTML标签构建了各种各样丰富的web应用。

然而在我们开发web应用的过程中，html标签提供的语义化并不能完全满足我们的场景。虽然在HTML5标准中，也增加了不少包括<header>、<section>、<article>、<nav>、<container>、<footer>等语义化标签，但它们主要是为内容或布局添加的通用语义化标签，在实际的场景中，我们还需要使用 class 等一些属性或者辅助说明，声明该标签的具体语义。

在我们在进行基于Vue的项目开发时，组件间的数据通信，是我们必须考虑的。

当谈到继承时，javascript只有一种结构：对象。 每个实例对象（object）都有一个私有属性__proto__指向它的构造函数的原型对象 prototype。 该原型对象也有自己的原型对象__proto__，层层向上，直到有一个的原型对象为null。根据定义，null没有原型，并作为这个原型链的最后一个环节。

标签提供关于 HTML 文档的元数据。它不会显示在页面上，但是对于机器是可读的。可用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 web 服务。

Web世界中，随着历史的发展，技术的迭代，发展出了许多不同的文档，只有了解文档的类型，浏览器才能正确的解析渲染文档。