From 5c6969450508ea9c2ccb307406f58d1ce915d823 Mon Sep 17 00:00:00 2001 From: dec0dOS Date: Wed, 4 Oct 2023 19:17:02 +0100 Subject: [PATCH] refactor: migrate to vite --- frontend/.eslintrc.json | 22 ++++++++++ frontend/{public => }/index.html | 6 +-- frontend/package.json | 23 ++++++---- frontend/src/components/Bar/Bar.jsx | 2 +- frontend/src/components/LogIn/LogIn.jsx | 2 +- .../components/NetworkRules/NetworkRules.jsx | 2 +- frontend/vite.config.js | 43 +++++++++++++++++++ 7 files changed, 86 insertions(+), 14 deletions(-) create mode 100644 frontend/.eslintrc.json rename frontend/{public => }/index.html (73%) create mode 100644 frontend/vite.config.js diff --git a/frontend/.eslintrc.json b/frontend/.eslintrc.json new file mode 100644 index 0000000..23cb38b --- /dev/null +++ b/frontend/.eslintrc.json @@ -0,0 +1,22 @@ +{ + "root": true, + "env": { "browser": true, "es2020": true }, + "extends": [ + "eslint:recommended", + "plugin:react/recommended", + "plugin:react/jsx-runtime", + "plugin:react-hooks/recommended" + ], + "ignorePatterns": ["dist", ".eslintrc.cjs"], + "parserOptions": { "ecmaVersion": "latest", "sourceType": "module" }, + "settings": { "react": { "version": "17.0.2" } }, + "plugins": ["react-refresh"], + "rules": { + "react-refresh/only-export-components": [ + "warn", + { "allowConstantExport": true } + ], + "react/prop-types": ["off"], + "no-unused-vars": ["off"] + } +} diff --git a/frontend/public/index.html b/frontend/index.html similarity index 73% rename from frontend/public/index.html rename to frontend/index.html index 03d4e3f..78b084e 100644 --- a/frontend/public/index.html +++ b/frontend/index.html @@ -2,18 +2,18 @@ - - + - + ZeroUI
+ diff --git a/frontend/package.json b/frontend/package.json index 430581d..83189fd 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -18,23 +18,30 @@ "react-dom": "^17.0.2", "react-is": "^17.0.2", "react-router-dom": "^5.2.0", - "react-scripts": "4.0.3", "react-use": "^17.4.0", "styled-components": "^5.3.5" }, "devDependencies": { - "source-map-explorer": "^2.5.2" + "@types/react": "^18.2.24", + "@types/react-dom": "^18.2.9", + "@vitejs/plugin-react": "^4.1.0", + "eslint": "^8.50.0", + "eslint-plugin-react": "^7.33.2", + "eslint-plugin-react-hooks": "^4.6.0", + "eslint-plugin-react-refresh": "^0.4.3", + "rimraf": "^5.0.5", + "source-map-explorer": "^2.5.3", + "vite": "^4.4.10" }, "scripts": { - "start": "BROWSER=none react-scripts start", - "build": "react-scripts build", + "start": "vite", + "build": "vite build", + "serve": "vite preview", + "clean": "rimraf build", + "lint": "eslint src --ext js,jsx --report-unused-disable-directives --max-warnings 0", "analyze": "source-map-explorer 'build/static/js/*.js'" }, "homepage": "/app", - "proxy": "http://127.0.0.1:4000", - "eslintConfig": { - "extends": "react-app" - }, "browserslist": { "production": [ ">0.2%", diff --git a/frontend/src/components/Bar/Bar.jsx b/frontend/src/components/Bar/Bar.jsx index 7f24969..2b91eda 100644 --- a/frontend/src/components/Bar/Bar.jsx +++ b/frontend/src/components/Bar/Bar.jsx @@ -90,7 +90,7 @@ function Bar() { > {menuItems.map((menuItem, index) => { if ( - menuItem.hasOwnProperty("condition") && + Object.prototype.hasOwnProperty.call(menuItem, "condition") && !menuItem.condition ) { return null; diff --git a/frontend/src/components/LogIn/LogIn.jsx b/frontend/src/components/LogIn/LogIn.jsx index 3ee3887..36ea9a2 100644 --- a/frontend/src/components/LogIn/LogIn.jsx +++ b/frontend/src/components/LogIn/LogIn.jsx @@ -6,7 +6,7 @@ import LogInToken from "./components/LogInToken"; function LogIn() { return ( <> - {process.env.NODE_ENV === "development" && ( + {import.meta.env.DEV && ( <> diff --git a/frontend/src/components/NetworkRules/NetworkRules.jsx b/frontend/src/components/NetworkRules/NetworkRules.jsx index 1fc6788..14dbd36 100644 --- a/frontend/src/components/NetworkRules/NetworkRules.jsx +++ b/frontend/src/components/NetworkRules/NetworkRules.jsx @@ -124,7 +124,7 @@ function NetworkRules({ network, callback }) { width: "250px", }} > - {!!errors.length ? ( + {errors.length ? ( {"[" + errors[0] + ":" + errors[1] + "] " + errors[2]} diff --git a/frontend/vite.config.js b/frontend/vite.config.js new file mode 100644 index 0000000..771f8cb --- /dev/null +++ b/frontend/vite.config.js @@ -0,0 +1,43 @@ +import { defineConfig } from "vite"; +import react from "@vitejs/plugin-react"; + +// import { join, parse, resolve } from "path"; +// import * as url from "url"; +// const __dirname = url.fileURLToPath(new URL(".", import.meta.url)); + +// function entryPoints(...paths) { +// const entries = paths.map(parse).map((entry) => { +// const { dir, base, name } = entry; +// const key = join(dir, name); +// const path = resolve(__dirname, dir, base); +// return [key, path]; +// }); + +// const config = Object.fromEntries(entries); +// return config; +// } + +export default defineConfig({ + base: "/app", + server: { + port: 3000, + strictPort: true, + proxy: { + "/auth": "http://127.0.0.1:4000", + "/api": "http://127.0.0.1:4000", + "/controller": "http://127.0.0.1:4000", + }, + }, + resolve: { + alias: { + components: "/src/components", + utils: "/src/utils", + external: "/src/external", + }, + }, + build: { + outDir: "build", + chunkSizeWarningLimit: 1000, + }, + plugins: [react()], +});