executeScript does not support ES modules

[sanand0]

Bug Report

Currently, executeScript: true does not run ES Modules and throws an Uncaught SyntaxError: Cannot use import statement outside a module.

Steps to reproduce

index.html:

<div id="app"></div>
<script>
  window.$docsify = {
    executeScript: true
  };
</script>

README.md:

<script type="module">
  import { rgb } from "https://cdn.skypack.dev/d3-color@3";
</script>

What is current behaviour

It throws an Uncaught SyntaxError: Cannot use import statement outside a module

What is the expected behaviour

Run the script as an ES module (or mention in the documentation that ES modules and imports are not supported.)

Other relevant information

• [x] Bug does still occur when all/other plugins are disabled?

• Your OS: Windows

• Node.js version: 18.4.0

• npm/yarn version: npm 8.12.1

• Browser version: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/111.0.0.0 Safari/537.36

• Docsify version: 4.13.0

• Docsify plugins: None

Please create a reproducible sandbox

Mention the docsify version in which this bug was not present (if any)

docsify 4.13.0

[trusktr]

Indeed! The fix should be easy.

[trusktr]

Btw, for now, to emulate a type=module script like this one:

<script type="module" src="./main.js"></script>

you can write it like this:

<script>
const runMain = () => import('./main.js')
if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", runMain);
else runMain();
</script>

The second is essentially what the first one is doing, and the first one is syntax sugar.

[sanand0]

Thanks, @trusktr. Since I'm using ESM to simplify examples, I'll await the fix you mentioned. Very grateful! 🙏