Auto preprocess throws on ES6 module scripts

[brunnerh]

Describe the bug When inserting a script in the HTML with type="module", the auto preprocessor will try to load a transformer for it (./transformers/module), which of course does not exist.

To Reproduce

• Set up auto preprocessing.
• Process a component like this:

<script></script>

<div>
    <script type="module">
         console.log('!');
    </script>
</div>

Expected behavior Scripts with type="module" are ignored.

Stacktraces

Stack trace

Error: Cannot find module './transformers/module'
Require stack:
- C:\project\node_modules\svelte-preprocess\dist\autoProcess.js
- C:\project\node_modules\svelte-preprocess\dist\index.js
- C:\project\webpack.config.ts
- C:\project\node_modules\webpack-cli\bin\utils\convert-argv.js
- C:\project\node_modules\webpack-cli\bin\cli.js
- C:\project\node_modules\webpack\bin\webpack.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17)
    at Function.Module._load (internal/modules/cjs/loader.js:686:27)
    at Module.require (internal/modules/cjs/loader.js:848:19)
    at require (C:\project\node_modules\v8-compile-cache\v8-compile-cache.js:161:20)
    at C:\project\node_modules\svelte-preprocess\dist\autoProcess.js:35:77
    at Object.exports.runTransformer (C:\project\node_modules\svelte-preprocess\dist\autoProcess.js:35:29)
    at C:\project\node_modules\svelte-preprocess\dist\autoProcess.js:96:29
    at script (C:\project\node_modules\svelte-preprocess\dist\autoProcess.js:121:33)
    at C:\project\node_modules\svelte\src\compiler\preprocess\index.ts:103:23
    at async Promise.all (index 0)
    at replace_async (C:\project\node_modules\svelte\src\compiler\preprocess\index.ts:60:48)
    at preprocess (C:\project\node_modules\svelte\src\compiler\preprocess\index.ts:95:12)
 @ ./src/test.ts 1:0-39 2:16-23

Information about your project:

• Your operating system: Windows 10 64bit
• svelte-preprocess version: 4.3.2
• Whether your project uses Webpack or Rollup: Webpack

[kaisermann]

Hey @brunnerh 👋

If I'm not mistaken you can pass preserve: ['module'] and it will be skipped.

Skipping type=module could be a default behavior, though 🤔

[brunnerh]

Did not know that. I worked around it by simply not using auto-mode.

[kaisermann]

Quick thought I had about this one:

I'm not sure if people would expect the babel transformer to run over script type="module" script tags that aren't at the root-level.

[brunnerh]

I for one do not know; don't really use Babel. But for Svelte components the distinction between top-level and everything else seems to make sense.

[floer32]

[In my case I "just" removed the type="module" I had (just grepped for it, and realized it wasn't serving a purpose anymore in that case). And that fixed it, of course. I know I'm kinda stating the obvious but I'm saying it in case someone's coming by here and unsure if they can just remove it. If you don't have many usages, or don't remember why you have them, you might just be able to remove them.]

[janzheng]

I'm running into a problem where I'm using svelte-preprocess, and I have two async functions, one in <script context="module"> and another one in the main script tag. I'm getting Identifier 'asyncGeneratorStep' has already been declared (Note that you need plugins to import files that are not JavaScript). I can get rid of the async function in the preload script, or I can get rid of it in the body, but I can't use both... I'm tried to add preserve: ['module'] but that doesn't seem to work. Any thoughts?

[DePasqualeOrg]

In case the same thing happens to anyone else searching for this error: It happened to me because I mistakenly left an extra <script> tag in the HTML area of one of my .svelte files.