笔.COOL Html编辑器使用说明
笔.COOL 的HTML编辑器本质上是将一个 html文件拆分成 html、css、js 三个代码片段，以形成 UI、样式与逻辑分离的编辑模式。 渲染时，它们会被合并成一个 html 文件进行渲染。
如果你想要仅仅编写单个 html文档，只要忽略 js、css编辑器即可，因为 html代码片段就是一个 html 文档，笔.COOL 只是将另外的 js、css 的代码片段插入到指定位置而已，你仍然可以在 html代码片段中通过 <script>、<style> 标签来编写脚本与样式。
最终代码转换如下图所示：
编辑器中的 html代码片段会被放到 <body> 中；
js 代码片段会被放到 <body> 的底部，方便用户写 js 代码时通常能够获取到已定义的 DOM 元素；而
css 代码片段会被放到 <head> 中。最终形成文件是一个非常标准的 html 文档。
目前编辑器不支持将js或css代码拆分到另外的文件引入，
但是可以引入第三方公共资源文件（如 jQuery、Three.js、Vuejs、React、GSAP 等），引入第三方的资源文件，只需在 html 片段中添加
<script src="xxx"></script>或
<link rel="stylesheet" href="xxx" />
标签引入即可 （国内常用公共库CDN有：
BootCDN，
七牛云公共库CDN，
字节跳动静态资源公共库）
。
笔.COOL 的JS编辑器还支持使用 ES6 的 import 语法。除了上述通过 <script src="xxx"></script>
标签的方式引入第三方脚本，还可以直接在 JS编辑器中通过 import 语法引入，例如引入 React库则可以这样写
（注意：如果你打算使用 React，记得将 JS预编译器切换为「Babel(+jsx)」或「TypeScript(+tsx)」）：
import React from "https://esm.sh/react@18.3.1";
如果你想使用 ES6 的 <script type="importmap">
, 只需在 html 代码片段中加入以下代码即可。例如引入 three：
此时你就能够在脚本中，通过名称进行 import ，例如：
import * as THREE from 'three';
import {OrbitControls} from 'three/addons/controls/OrbitControls.js';
import Stats from 'three/addons/libs/stats.module.js';
