从零开始写一个 Web Component - GitHub Corners

Web Components

什么是 Web Components?

Web Components 是一套不同的技术，允许您创建可重用的定制元素（它们的功能封装在您的代码之外）并且在您的 web 应用中使用它们。

Web Components 实际上和现在 React/Vue 等前端框架的组件概念十分相似，或者倒不如说 Vue 的 SFC（单文件组件）其实正是借鉴自 Web Components 的概念。
它本身 Shadow DOM 的方案做了 CSS 隔离，很好地解决了 CSS 命名污染等问题，但 Web Components 除了规范推进缓慢，也还有很多开发（效率、生态、兼容等）上的不足。

简单来说 Web Components 其实就好比给予你一些浏览器的 API 权限，去定义一个 HTML 标签来自己使用。
更多的介绍其实看 MDN 的介绍即可，也无需在这听我这二手的长篇大论。

Web Components | MDN

我自己本身也向来讨厌通篇理论，而热衷实践，所以我们不妨动手一试，写一个真正实用的 Web Component - github-corners。（成果请到文章末尾取用）

访问 https://www.yunyoujun.cn/posts/how-to-write-a-web-component 阅读全文。