From 4415ff698c19f1de4032cf560add19b4f1c22287 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arnaud=20Barr=C3=A9?= Date: Sat, 11 Jan 2025 21:54:58 +0100 Subject: [PATCH 1/3] feat: add useAtYourOwnRiskEditConfig option --- README.md | 14 ++++++++++++++ src/index.ts | 18 ++++++++++++++++-- 2 files changed, 30 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 69b6a8f..d3ff50a 100644 --- a/README.md +++ b/README.md @@ -93,6 +93,20 @@ react({ }); ``` +### useAtYourOwnRiskEditConfig + +The future of Vite is with OXC, and from the beginning this was a design choice to not exposed too many specialties from SWC so that Vite React users can move to another transformer later. +Also debugging why some specific version of decorators with some other unstable/legacy feature doesn't work is not fun, so we won't provide support for it, hence the name `useAtYourOwnRisk`. + +```ts +react({ + useAtYourOwnRiskEditConfig(options) { + options.jsc.parser.decorators = true; + options.jsc.transform.decoratorVersion = "2022-03"; + }, +}); +``` + ## Consistent components exports For React refresh to work correctly, your file should only export React components. The best explanation I've read is the one from the [Gatsby docs](https://www.gatsbyjs.com/docs/reference/local-development/fast-refresh/#how-it-works). diff --git a/src/index.ts b/src/index.ts index 7ee93d3..b0053a0 100644 --- a/src/index.ts +++ b/src/index.ts @@ -8,6 +8,7 @@ import { ReactConfig, JscTarget, transform, + type Options as SWCOptions, } from "@swc/core"; import { PluginOption, UserConfig, BuildOptions } from "vite"; import { createRequire } from "module"; @@ -58,6 +59,14 @@ type Options = { * Exclusion of node_modules should be handled by the function if needed. */ parserConfig?: (id: string) => ParserConfig | undefined; + /** + * The future of Vite is with OXC, and from the beginning this was a design choice + * to not exposed too many specialties from SWC so that Vite React users can move to + * another transformer later. + * Also debugging why some specific version of decorators with some other unstable/legacy + * feature doesn't work is not fun, so we won't provide support for it, hence the name `useAtYourOwnRisk` + */ + useAtYourOwnRiskEditConfig?: (options: SWCOptions) => void; }; const isWebContainer = globalThis.process?.versions?.webcontainer; @@ -72,6 +81,7 @@ const react = (_options?: Options): PluginOption[] => { : undefined, devTarget: _options?.devTarget ?? "es2020", parserConfig: _options?.parserConfig, + useAtYourOwnRiskEditConfig: _options?.useAtYourOwnRiskEditConfig, }; return [ @@ -238,7 +248,7 @@ const transformWithOptions = async ( let result: Output; try { - result = await transform(code, { + const swcOptions: SWCOptions = { filename: id, swcrc: false, configFile: false, @@ -252,7 +262,11 @@ const transformWithOptions = async ( react: reactConfig, }, }, - }); + }; + if (options.useAtYourOwnRiskEditConfig) { + options.useAtYourOwnRiskEditConfig(swcOptions); + } + result = await transform(code, swcOptions); } catch (e: any) { const message: string = e.message; const fileStartIndex = message.indexOf("╭─["); From 35bdaa450431256683aefdf05fef1586eb7f76fe Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arnaud=20Barr=C3=A9?= Date: Tue, 14 Jan 2025 02:49:40 +0100 Subject: [PATCH 2/3] rename --- README.md | 4 ++-- src/index.ts | 9 +++++---- 2 files changed, 7 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index d3ff50a..faa973e 100644 --- a/README.md +++ b/README.md @@ -93,14 +93,14 @@ react({ }); ``` -### useAtYourOwnRiskEditConfig +### useAtYourOwnRisk_mutateSwcOptions The future of Vite is with OXC, and from the beginning this was a design choice to not exposed too many specialties from SWC so that Vite React users can move to another transformer later. Also debugging why some specific version of decorators with some other unstable/legacy feature doesn't work is not fun, so we won't provide support for it, hence the name `useAtYourOwnRisk`. ```ts react({ - useAtYourOwnRiskEditConfig(options) { + useAtYourOwnRisk_mutateSwcOptions(options) { options.jsc.parser.decorators = true; options.jsc.transform.decoratorVersion = "2022-03"; }, diff --git a/src/index.ts b/src/index.ts index b0053a0..9a98eef 100644 --- a/src/index.ts +++ b/src/index.ts @@ -66,7 +66,7 @@ type Options = { * Also debugging why some specific version of decorators with some other unstable/legacy * feature doesn't work is not fun, so we won't provide support for it, hence the name `useAtYourOwnRisk` */ - useAtYourOwnRiskEditConfig?: (options: SWCOptions) => void; + useAtYourOwnRisk_mutateSwcOptions?: (options: SWCOptions) => void; }; const isWebContainer = globalThis.process?.versions?.webcontainer; @@ -81,7 +81,8 @@ const react = (_options?: Options): PluginOption[] => { : undefined, devTarget: _options?.devTarget ?? "es2020", parserConfig: _options?.parserConfig, - useAtYourOwnRiskEditConfig: _options?.useAtYourOwnRiskEditConfig, + useAtYourOwnRisk_mutateSwcOptions: + _options?.useAtYourOwnRisk_mutateSwcOptions, }; return [ @@ -263,8 +264,8 @@ const transformWithOptions = async ( }, }, }; - if (options.useAtYourOwnRiskEditConfig) { - options.useAtYourOwnRiskEditConfig(swcOptions); + if (options.useAtYourOwnRisk_mutateSwcOptions) { + options.useAtYourOwnRisk_mutateSwcOptions(swcOptions); } result = await transform(code, swcOptions); } catch (e: any) { From 387b73f390351030002203f0ee60cb0e0b78be91 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arnaud=20Barr=C3=A9?= Date: Tue, 14 Jan 2025 02:51:41 +0100 Subject: [PATCH 3/3] Add changelog --- CHANGELOG.md | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index b5d9f9d..3164380 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,20 @@ ## Unreleased +### Add useAtYourOwnRisk_mutateSwcOptions option + +The future of Vite is with OXC, and from the beginning this was a design choice to not exposed too many specialties from SWC so that Vite React users can move to another transformer later. +Also debugging why some specific version of decorators with some other unstable/legacy feature doesn't work is not fun, so we won't provide support for it, hence the name `useAtYourOwnRisk`. + +```ts +react({ + useAtYourOwnRisk_mutateSwcOptions(options) { + options.jsc.parser.decorators = true; + options.jsAc.transform.decoratorVersion = "2022-03"; + }, +}); +``` + ## 3.7.2 ### Add Vite 6 to peerDependencies range [#207](https://github.com/vitejs/vite-plugin-react-swc/pull/207)