实用技巧

本页收集了一些经常被问到、但出于设计理念无法放进界面的功能。

ES6 模块

规则之间不能导入或导出 ES6 模块，但可以使用来自互联网的模块，例如这样：

;(async () => {
  const { module } = await import("https://...")
  // your code is here
})()

像 2.x 版本那样加载模块

从 3.x 版本起，模块在首次加载后会被缓存，之后只能在模块编辑窗口中手动更新。模块不再从网站的 DOM 树加载，而是直接嵌入脚本。

如果需要从 DOM 加载，或者外部脚本需要频繁更新，最好不要使用扩展的模块功能，而是直接通过 JS 加载：

Promise.allSettled([
  loadScript("https://...js"),
  loadScript("https://...js"),
]).then(() => {
  // your code is here
})

function loadScript(src) {
  return new Promise(function (resolve, reject) {
    const script = document.createElement("script")
    script.src = src
    script.onload = resolve
    script.onerror = reject
    document.head.append(script)
  })
}