✨ Adding babel transform options #7

README.md

@@ -106,6 +106,13 @@ If set to false, it won't inject the runtime in dev.
 
 This will force SSR code in the produced files. This is experiemental and mostly not working yet.
 
+#### options.babel
+
+- Type: Babel.TransformOptions
+- Default: {}
+
+Pass any additional [babel transform options](https://babeljs.io/docs/en/options). Those will be merged with the transformations required by Solid.
+
 ## Note on HMR
 
 Starting from version `1.1.0`, this plugin handle automatic HMR via [solid-refresh](https://github.com/ryansolid/solid-refresh).

playground/index.tsx

@@ -6,6 +6,13 @@ import { Router, Route, RouteDefinition, Link } from 'solid-app-router';
 import test from '@@/test.txt?raw'
 import Home from '@/index';
 
+// This needs to be tested once vite upgrade to esbuild 0.10.0
+
+// const json = await fetch('https://jsonplaceholder.typicode.com/todos/1')
+// .then(response => response.json())
+
+// console.log({ json })
+
 // This should log Hello World
 console.log(test)
 

playground/package.json

@@ -7,6 +7,7 @@
   },
   "license": "MIT",
   "devDependencies": {
+    "@babel/plugin-syntax-top-level-await": "^7.12.13",
     "vite": "^2.1.5"
   },
   "dependencies": {

playground/vite.config.ts

@@ -1,13 +1,19 @@
-import solid from '../src';
+import solid from '..';
 import { defineConfig } from 'vite';
-import { resolve } from 'path'
+import { resolve } from 'path';
 
 export default defineConfig({
-  plugins: [solid()],
+  plugins: [
+    solid({
+      babel: {
+        plugins: ['@babel/plugin-syntax-top-level-await'],
+      },
+    }),
+  ],
   resolve: {
     alias: {
       '@': '/pages',
-      '@@': '/assets'
-    }
-  }
+      '@@': '/assets',
+    },
+  },
 });

src/index.ts

@@ -11,6 +11,10 @@ interface Options {
   dev: boolean;
   ssr: boolean;
   hot: boolean;
+  babel:
+    | TransformOptions
+    | ((source: string, id: string, ssr: boolean) => TransformOptions)
+    | ((source: string, id: string, ssr: boolean) => Promise<TransformOptions>);
 }
 
 export default function solidPlugin(options: Partial<Options> = {}): Plugin {
@@ -88,7 +92,21 @@ export default function solidPlugin(options: Partial<Options> = {}): Plugin {
         opts.presets.push(require('@babel/preset-typescript'));
       }
 
-      const { code, map } = await transformAsync(source, opts);
+      // Default value for babel user options
+      let babelUserOptions: TransformOptions = {};
+
+      if (options.babel) {
+        if (typeof options.babel === 'function') {
+          const babelOptions = options.babel(source, id, ssr);
+          babelUserOptions = babelOptions instanceof Promise ? await babelOptions : babelOptions;
+        } else {
+          babelUserOptions = options.babel;
+        }
+      }
+
+      const babelOptions = mergeAndConcat(babelUserOptions, opts) as TransformOptions;
+
+      const { code, map } = await transformAsync(source, babelOptions);
 
       return { code, map };
     },