mirror of
				https://github.com/blakeblackshear/frigate.git
				synced 2025-10-27 10:52:11 +01:00 
			
		
		
		
	Update web readme (#12062)
* Update web readme * Update /web readme * Apply suggestions from code review Co-authored-by: Nicolas Mowen <nickmowen213@gmail.com> --------- Co-authored-by: Sam Wright <sam@sams-mbp.lan> Co-authored-by: Nicolas Mowen <nickmowen213@gmail.com>
This commit is contained in:
		
							parent
							
								
									7b57a66d45
								
							
						
					
					
						commit
						10c1f7ead4
					
				
							
								
								
									
										5
									
								
								web/.vscode/extensions.json
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										5
									
								
								web/.vscode/extensions.json
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,5 @@ | ||||
| { | ||||
|     "recommendations": [ | ||||
|       "dbaeumer.vscode-eslint" | ||||
|     ] | ||||
|   } | ||||
| @ -1,30 +1,25 @@ | ||||
| # React + TypeScript + Vite | ||||
| This is the Frigate frontend which connects to and provides a User Interface to the Python backend. | ||||
| 
 | ||||
| This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. | ||||
| # Web Development | ||||
| 
 | ||||
| Currently, two official plugins are available: | ||||
| ## Installing Web Dependencies Via NPM | ||||
| 
 | ||||
| - [@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 | ||||
| Within `/web`, run: | ||||
| 
 | ||||
| ## 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, | ||||
|   }, | ||||
| } | ||||
| ```bash | ||||
| npm install | ||||
| ``` | ||||
| 
 | ||||
| - 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 | ||||
| ## Running development frontend | ||||
| 
 | ||||
| Within `/web`, run: | ||||
| 
 | ||||
| ```bash | ||||
| PROXY_HOST=<ip_address:port> npm run dev | ||||
| ``` | ||||
| 
 | ||||
| The Proxy Host can point to your existing Frigate instance. Otherwise defaults to `localhost:5000` if running Frigate on the same machine. | ||||
| 
 | ||||
| ## Extensions | ||||
| Install these IDE extensions for an improved development experience: | ||||
| - eslint | ||||
|  | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user