feat: add readme vite example

This commit is contained in:
Mauricio Siu
2024-06-30 19:55:07 -06:00
parent 740ef02fef
commit 0aadbd63c7

View File

@@ -1,30 +1,26 @@
# React + TypeScript + Vite
# Vite React Example
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
This repository contains an example of vuejs application that is deployed on Dokploy.
Currently, two official plugins are available:
- [@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
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
1. **Use Git Provider in Your Application**:
- Repository: `https://github.com/Dokploy/examples.git`
- Branch: `main`
- Build path: `/vite-simple`
## Expanding the ESLint configuration
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
- Configure the top-level `parserOptions` property like this:
```js
export default {
// other rules...
parserOptions: {
ecmaVersion: 'latest',
sourceType: 'module',
project: ['./tsconfig.json', './tsconfig.node.json'],
tsconfigRootDir: __dirname,
},
}
2. **Add Environment Variables**:
- Navigate to the "Environments" tab and add the following variable:
```plaintext
NIXPACKS_START_CMD="pnpm run preview"
```
- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list
3. **Click on Deploy**:
- Deploy your application by clicking the deploy button.
4. **Generate a Domain**:
- Click on generate domain button.
- A new domain will be generated for you.
- You can use this domain to access your application.
If you need further assistance, join our [Discord server](https://discord.com/invite/2tBnJ3jDJc).