Skip to content

Commit 4c919dd

Browse files
authored
chore: update README to add "moved" note (#273)
1 parent 8971041 commit 4c919dd

File tree

1 file changed

+3
-112
lines changed

1 file changed

+3
-112
lines changed

README.md

+3-112
Original file line numberDiff line numberDiff line change
@@ -1,116 +1,7 @@
1-
# @vitejs/plugin-react-swc [![npm](https://img.shields.io/npm/v/@vitejs/plugin-react-swc)](https://www.npmjs.com/package/@vitejs/plugin-react-swc)
1+
# [ARCHIVED] @vitejs/plugin-react-swc [![npm](https://img.shields.io/npm/v/@vitejs/plugin-react-swc)](https://www.npmjs.com/package/@vitejs/plugin-react-swc)
22

3-
Speed up your Vite dev server with [SWC](https://swc.rs/)
4-
5-
- ✅ A fast Fast Refresh (~20x faster than Babel)
6-
- ✅ Enable [automatic JSX runtime](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html)
7-
8-
## Installation
9-
10-
```sh
11-
npm i -D @vitejs/plugin-react-swc
12-
```
13-
14-
## Usage
15-
16-
```ts
17-
import { defineConfig } from "vite";
18-
import react from "@vitejs/plugin-react-swc";
19-
20-
export default defineConfig({
21-
plugins: [react()],
22-
});
23-
```
24-
25-
## Caveats
26-
27-
This plugin has limited options to enable good performances and be transpiler agnostic. Here is the list of non-configurable options that impact runtime behaviour:
28-
29-
- [useDefineForClassFields](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-7.html#the-usedefineforclassfields-flag-and-the-declare-property-modifier) is always activated, as this matches the current ECMAScript spec
30-
- `jsx runtime` is always `automatic`
31-
- In development:
32-
- esbuild is disabled, so the [esbuild configuration](https://vitejs.dev/config/shared-options.html#esbuild) has no effect
33-
- `target` is ignored and defaults to `es2020` (see [`devTarget`](#devtarget))
34-
- JS files are not transformed
35-
- tsconfig is not resolved, so properties other than the ones listed above behaves like TS defaults
36-
37-
## Options
38-
39-
### jsxImportSource
40-
41-
Control where the JSX factory is imported from.
42-
43-
`@default` "react"
44-
45-
```ts
46-
react({ jsxImportSource: "@emotion/react" });
47-
```
48-
49-
### tsDecorators
50-
51-
Enable TypeScript decorators. Requires `experimentalDecorators` in tsconfig.
52-
53-
`@default` false
54-
55-
```ts
56-
react({ tsDecorators: true });
57-
```
58-
59-
### plugins
60-
61-
Use SWC plugins. Enable SWC at build time.
62-
63-
```ts
64-
react({ plugins: [["@swc/plugin-styled-components", {}]] });
65-
```
66-
67-
### devTarget
68-
69-
Set the target for SWC in dev. This can avoid to down-transpile private class method for example.
70-
71-
For production target, see https://vitejs.dev/config/build-options.html#build-target.
72-
73-
`@default` "es2020"
74-
75-
```ts
76-
react({ devTarget: "es2022" });
77-
```
78-
79-
### parserConfig
80-
81-
Override the default include list (.ts, .tsx, .mts, .jsx, .mdx).
82-
83-
This requires to redefine the config for any file you want to be included (ts, mdx, ...).
84-
85-
If you want to trigger fast refresh on compiled JS, use `jsx: true`. Exclusion of node_modules should be handled by the function if needed. Using this option to use JSX inside `.js` files is highly discouraged and can be removed in any future version.
86-
87-
```ts
88-
react({
89-
parserConfig(id) {
90-
if (id.endsWith(".res")) return { syntax: "ecmascript", jsx: true };
91-
if (id.endsWith(".ts")) return { syntax: "typescript", tsx: false };
92-
},
93-
});
94-
```
95-
96-
### useAtYourOwnRisk_mutateSwcOptions
97-
98-
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.
99-
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`.
100-
101-
```ts
102-
react({
103-
useAtYourOwnRisk_mutateSwcOptions(options) {
104-
options.jsc.parser.decorators = true;
105-
options.jsc.transform.decoratorVersion = "2022-03";
106-
},
107-
});
108-
```
3+
This repo has moved to [vitejs/vite-plugin-react:/packages/vite-plugin-react-swc](https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react-swc).
1094

1105
## Consistent components exports
1116

112-
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).
113-
114-
If an incompatible change in exports is found, the module will be invalidated and HMR will propagate. To make it easier to export simple constants alongside your component, the module is only invalidated when their value changes.
115-
116-
You can catch mistakes and get more detailed warning with this [eslint rule](https://github.com/ArnaudBarre/eslint-plugin-react-refresh).
7+
See <https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react-swc#consistent-components-exports>.

0 commit comments

Comments
 (0)