(chore) Add mappings generation to svelte2tsx repl (#972)

Author: pushkine

packages/svelte2tsx/repl/index.svelte

@@ -0,0 +1,7 @@
+<script>
+    export let value;
+</script>
+
+{#if value}
+    <input bind:value on:change />
+{/if}

packages/svelte2tsx/rollup.config.js

@@ -5,26 +5,66 @@ import typescript from '@rollup/plugin-typescript';
 import builtins from 'builtin-modules';
 import fs from 'fs';
 import path from 'path';
+import { decode } from 'sourcemap-codec';
+
+const DEV = !!process.env.ROLLUP_WATCH;
 
 function repl() {
+    require('ts-node').register({
+        project: 'test/tsconfig.json',
+        transpileOnly: true
+    });
+    const OUTDIR = path.resolve(__dirname, 'repl', 'output');
+
+    const INPUT = path.resolve(__dirname, 'repl', 'index.svelte');
+    const OUTPUT = path.resolve(__dirname, 'repl', 'output', 'code.tsx');
+    const MAP = path.resolve(__dirname, 'repl', 'output', 'code.tsx.map');
+    const MAPPINGS = path.resolve(__dirname, 'repl', 'output', 'mappings.jsx');
+
     return {
         name: 'dev-repl',
         buildStart() {
-            this.addWatchFile('./repl/index.svelte');
+            this.addWatchFile(INPUT);
         },
         writeBundle() {
-            if (!this.meta.watchMode) return;
+            const BUILD = require.resolve('./index.js');
+            const BUILD_TEST = require.resolve('./test/build.ts');
 
-            const repl = `${__dirname}/repl/`;
-            const output = `${__dirname}/repl/output/`;
-
-            delete require.cache[path.resolve(__dirname, 'index.js')];
+            delete require.cache[BUILD];
             const svelte2tsx = require('./index.js');
 
-            const tsx = svelte2tsx(fs.readFileSync(`${repl}/index.svelte`, 'utf-8'));
+            delete require.cache[BUILD_TEST];
+            require.cache[BUILD_TEST] = require.cache[BUILD];
+            const { process_transformed_text } = require('./test/sourcemaps/process');
+
+            const input_content = fs.readFileSync(INPUT, 'utf-8');
 
-            if (!fs.existsSync(output)) fs.mkdirSync(output);
-            fs.writeFileSync(`${repl}/output/code.tsx`, tsx.code);
+            try {
+                const { code, map } = svelte2tsx(input_content);
+
+                map.file = 'code.tsx';
+                map.sources = ['index.svelte'];
+                map.sourcesContent = [input_content];
+
+                if (!fs.existsSync(OUTDIR)) fs.mkdirSync(OUTDIR);
+                fs.writeFileSync(OUTPUT, code);
+                fs.writeFileSync(MAP, map.toString());
+
+                try {
+                    const mappings = process_transformed_text(
+                        input_content,
+                        code, // @ts-expect-error
+                        decode(map.mappings)
+                    ).print_mappings();
+
+                    fs.writeFileSync(MAPPINGS, mappings);
+                } catch (e) {
+                    fs.writeFileSync(MAPPINGS, e.toString());
+                }
+            } catch (e) {
+                fs.writeFileSync(OUTPUT, e.toString());
+                fs.writeFileSync(MAPPINGS, e.toString());
+            }
         }
     };
 }
@@ -33,11 +73,13 @@ export default [
         input: 'src/index.ts',
         output: [
             {
+                exports: 'auto',
                 sourcemap: true,
                 format: 'commonjs',
                 file: 'index.js'
             },
             {
+                exports: 'auto',
                 file: 'index.mjs',
                 format: 'esm'
             }
@@ -47,7 +89,7 @@ export default [
             commonjs(),
             json(),
             typescript({ include: ['src/**/*'] }),
-            repl()
+            DEV && repl()
         ],
         watch: {
             clearScreen: false