✨ Adding opt-in @babel/preset-typescript options

README.md

@@ -20,7 +20,7 @@ Join [solid discord](https://discord.com/invite/solidjs) and check the [troubles
 
 ## Requirements
 
-We've recently made this module 100% esm compatible. As per [this document](https://nodejs.org/api/esm.html) it is strongly recommended to have at least version `14.13.0` of node installed.
+This module 100% esm compatible. As per [this document](https://nodejs.org/api/esm.html) it is strongly recommended to have at least the version `14.13.0` of node installed.
 
 You can check your current version of node by typing `node -v` in your terminal. If your version is below that one version I'd encourage you to either do an update globally or use a node version management tool such as [volta](https://volta.sh/) or [nvm](https://github.com/nvm-sh/nvm).
 
@@ -129,6 +129,13 @@ Pass any additional [babel transform options](https://babeljs.io/docs/en/options
 Pass any additional [babel-plugin-jsx-dom-expressions](https://github.com/ryansolid/dom-expressions/tree/main/packages/babel-plugin-jsx-dom-expressions#plugin-options).
 They will be merged with the defaults sets by [babel-preset-solid](https://github.com/solidjs/solid/blob/main/packages/babel-preset-solid/index.js#L8-L25).
 
+#### options.typescript
+
+- Type: [@babel/preset-typescript](https://babeljs.io/docs/en/babel-preset-typescript)
+- Default: {}
+
+Pass any additional [@babel/preset-typescript](https://babeljs.io/docs/en/babel-preset-typescript).
+
 ## Note on HMR
 
 Starting from version `1.1.0`, this plugin handle automatic HMR via [solid-refresh](https://github.com/solidjs/solid-refresh).
@@ -165,6 +172,8 @@ if (import.meta.hot) {
 
 - If one of your dependency spit out React code instead of Solid that means that they don't expose JSX properly. To get around it, you might want to manually exclude it from the [dependencies optimization](https://vitejs.dev/config/#optimizedeps-exclude)
 
+- If you are trying to make [directives](https://www.solidjs.com/docs/latest/api#use%3A___) work and they somehow don't try setting the `options.typescript.onlyRemoveTypeImports` option to `true`
+
 ## Migration from v1
 
 The master branch now target vite 2.

playground/pages/index.tsx

@@ -1,5 +1,4 @@
-import { createRenderEffect, createSignal } from 'solid-js';
-import type { Accessor } from 'solid-js';
+import { Accessor, createRenderEffect, createSignal } from 'solid-js';
 
 function model(
   element: HTMLInputElement,

playground/vite.config.js

@@ -2,6 +2,7 @@ import solid from 'vite-plugin-solid';
 import { defineConfig } from 'vite';
 
 export default defineConfig({
+  target: 'esnext',
   plugins: [
     solid({
       babel: {

src/index.ts

@@ -47,6 +47,125 @@ export interface Options {
     | TransformOptions
     | ((source: string, id: string, ssr: boolean) => TransformOptions)
     | ((source: string, id: string, ssr: boolean) => Promise<TransformOptions>);
+  typescript: {
+    /**
+     * Forcibly enables jsx parsing. Otherwise angle brackets will be treated as
+     * typescript's legacy type assertion var foo = <string>bar;. Also, isTSX:
+     * true requires allExtensions: true.
+     *
+     * @default false
+     */
+    isTSX?: boolean;
+
+    /**
+     * Replace the function used when compiling JSX expressions. This is so that
+     * we know that the import is not a type import, and should not be removed.
+     *
+     * @default React
+     */
+    jsxPragma?: string;
+
+    /**
+     * Replace the function used when compiling JSX fragment expressions. This
+     * is so that we know that the import is not a type import, and should not
+     * be removed.
+     *
+     * @default React.Fragment
+     */
+    jsxPragmaFrag?: string;
+
+    /**
+     * Indicates that every file should be parsed as TS or TSX (depending on the
+     * isTSX option).
+     *
+     * @default false
+     */
+    allExtensions?: boolean;
+
+    /**
+     * Enables compilation of TypeScript namespaces.
+     *
+     * @default uses the default set by @babel/plugin-transform-typescript.
+     */
+    allowNamespaces?: boolean;
+
+    /**
+     * When enabled, type-only class fields are only removed if they are
+     * prefixed with the declare modifier:
+     *
+     * > NOTE: This will be enabled by default in Babel 8
+     *
+     * @default false
+     *
+     * @example
+     * ```ts
+     * class A {
+     *   declare foo: string; // Removed
+     *   bar: string; // Initialized to undefined
+     *    prop?: string; // Initialized to undefined
+     *    prop1!: string // Initialized to undefined
+     * }
+     * ```
+     */
+    allowDeclareFields?: boolean;
+
+    /**
+     * When set to true, the transform will only remove type-only imports
+     * (introduced in TypeScript 3.8). This should only be used if you are using
+     * TypeScript >= 3.8.
+     *
+     * @default false
+     */
+    onlyRemoveTypeImports?: boolean;
+
+    /**
+     * When set to true, Babel will inline enum values rather than using the
+     * usual enum output:
+     *
+     * This option differs from TypeScript's --isolatedModules behavior, which
+     * ignores the const modifier and compiles them as normal enums, and aligns
+     * Babel's behavior with TypeScript's default behavior.
+     *
+     * ```ts
+     *  // Input
+     *  const enum Animals {
+     *    Fish
+     *  }
+     *  console.log(Animals.Fish);
+     *
+     *  // Default output
+     *  var Animals;
+     *
+     *  (function (Animals) {
+     *    Animals[Animals["Fish"] = 0] = "Fish";
+     *  })(Animals || (Animals = {}));
+     *
+     *  console.log(Animals.Fish);
+     *
+     *  // `optimizeConstEnums` output
+     *  console.log(0);
+     * ```
+     *
+     * However, when exporting a const enum Babel will compile it to a plain
+     * object literal so that it doesn't need to rely on cross-file analysis
+     * when compiling it:
+     *
+     * ```ts
+     * // Input
+     * export const enum Animals {
+     *   Fish,
+     * }
+     *
+     * // `optimizeConstEnums` output
+     * export var Animals = {
+     *     Fish: 0,
+     * };
+     * ```
+     *
+     * @default false
+     */
+    optimizeConstEnums?: boolean;
+  };
   /**
    * Pass any additional [babel-plugin-jsx-dom-expressions](https://github.com/ryansolid/dom-expressions/tree/main/packages/babel-plugin-jsx-dom-expressions#plugin-options).
    * They will be merged with the defaults sets by [babel-preset-solid](https://github.com/solidjs/solid/blob/main/packages/babel-preset-solid/index.js#L8-L25).
@@ -187,8 +306,7 @@ export default function solidPlugin(options: Partial<Options> = {}): Plugin {
       };
 
       if (id.includes('tsx')) {
-        // The `onlyRemoveTypeImports` prevent directives from failing
-        opts.presets.push([ts, { onlyRemoveTypeImports: true }]);
+        opts.presets.push([ts, options.typescript || {}]);
       }
 
       // Default value for babel user options