···11+# React + TypeScript + Vite
22+33+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
44+55+Currently, two official plugins are available:
66+77+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
88+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
99+1010+## Expanding the ESLint configuration
1111+1212+If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
1313+1414+- Configure the top-level `parserOptions` property like this:
1515+1616+```js
1717+export default tseslint.config({
1818+ languageOptions: {
1919+ // other options...
2020+ parserOptions: {
2121+ project: ['./tsconfig.node.json', './tsconfig.app.json'],
2222+ tsconfigRootDir: import.meta.dirname,
2323+ },
2424+ },
2525+})
2626+```
2727+2828+- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
2929+- Optionally add `...tseslint.configs.stylisticTypeChecked`
3030+- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:
3131+3232+```js
3333+// eslint.config.js
3434+import react from 'eslint-plugin-react'
3535+3636+export default tseslint.config({
3737+ // Set the react version
3838+ settings: { react: { version: '18.3' } },
3939+ plugins: {
4040+ // Add the react plugin
4141+ react,
4242+ },
4343+ rules: {
4444+ // other rules...
4545+ // Enable its recommended rules
4646+ ...react.configs.recommended.rules,
4747+ ...react.configs['jsx-runtime'].rules,
4848+ },
4949+})
5050+```