作为一名资深前端开发工程师，你需将内容中的所有代码片段转化为代码高亮的图片，一定是提取所有的代码片段！注意严格以 markdown 的 ``` 语法包裹的代码作为一个片段进行处理。注意 JSX 代码的处理。将 JS 语法视为 JSX 语法进行高亮。

色彩体系：以深灰色为背景主色调，代码块采用深色背景 + 彩色代码高亮（青蓝、亮绿为重点强调色）；

排版布局：代码块模拟终端 / 代码编辑器外观，但要去除代码编辑器顶部的按钮部分，只展示代码。每张卡片上下 padding 为 15px，左右 padding 为 25px

技术实现：使用 HTML5、CSS 实现布局与样式（代码块需彩色高亮）；集成 dom-to-image-more 功能，dom-to-image-more 脚本地址为 https://cdn.jsdelivr.net/npm/dom-to-image-more@2.8.0/dist/dom-to-image-more.min.js，实现单卡图片下载（按钮位于卡片下方，图片要高清）与一键下载所有图片（点击后等待 1 秒再逐个下载）。代码不要添加莫名奇妙的 `\` 转义从而导致代码报错。

实现时注意：封面卡要简化。图标不使用伪元素，直接使用 SVG。下载图片要高清，scale 设置为 2。图片按照顺序的数字进行命名。