Migrated from CRA to Vite
This commit is contained in:
		
							
								
								
									
										2
									
								
								Makefile
									
									
									
									
									
								
							
							
						
						
									
										2
									
								
								Makefile
									
									
									
									
									
								
							@@ -3,7 +3,7 @@ all: frontend backend
 | 
			
		||||
frontend:
 | 
			
		||||
	cd virtweb_frontend && npm run build && cd ..
 | 
			
		||||
	rm -rf virtweb_backend/static
 | 
			
		||||
	mv virtweb_frontend/build virtweb_backend/static
 | 
			
		||||
	mv virtweb_frontend/dist virtweb_backend/static
 | 
			
		||||
 | 
			
		||||
backend: frontend
 | 
			
		||||
	cd virtweb_backend && cargo clippy -- -D warnings && cargo build --release
 | 
			
		||||
 
 | 
			
		||||
@@ -1 +1 @@
 | 
			
		||||
REACT_APP_BACKEND=http://localhost:8000/api
 | 
			
		||||
VITE_APP_BACKEND=http://localhost:8000/api
 | 
			
		||||
 
 | 
			
		||||
@@ -1 +1 @@
 | 
			
		||||
REACT_APP_BACKEND=/api
 | 
			
		||||
VITE_APP_BACKEND=/api
 | 
			
		||||
 
 | 
			
		||||
@@ -2,25 +2,25 @@
 | 
			
		||||
<html lang="en">
 | 
			
		||||
  <head>
 | 
			
		||||
    <meta charset="utf-8" />
 | 
			
		||||
    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
 | 
			
		||||
    <link rel="icon" href="/favicon.ico" />
 | 
			
		||||
    <meta name="viewport" content="width=device-width, initial-scale=1" />
 | 
			
		||||
    <meta name="theme-color" content="#000000" />
 | 
			
		||||
    <meta
 | 
			
		||||
      name="description"
 | 
			
		||||
      content="Web site created using create-react-app"
 | 
			
		||||
    />
 | 
			
		||||
    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
 | 
			
		||||
    <link rel="apple-touch-icon" href="/logo192.png" />
 | 
			
		||||
    <!--
 | 
			
		||||
      manifest.json provides metadata used when your web app is installed on a
 | 
			
		||||
      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
 | 
			
		||||
    -->
 | 
			
		||||
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
 | 
			
		||||
    <link rel="manifest" href="/manifest.json" />
 | 
			
		||||
    <!--
 | 
			
		||||
      Notice the use of %PUBLIC_URL% in the tags above.
 | 
			
		||||
      Notice the use of  in the tags above.
 | 
			
		||||
      It will be replaced with the URL of the `public` folder during the build.
 | 
			
		||||
      Only files inside the `public` folder can be referenced from the HTML.
 | 
			
		||||
 | 
			
		||||
      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
 | 
			
		||||
      Unlike "/favicon.ico" or "favicon.ico", "/favicon.ico" will
 | 
			
		||||
      work correctly both with client-side routing and a non-root public URL.
 | 
			
		||||
      Learn how to configure a non-root public URL by running `npm run build`.
 | 
			
		||||
    -->
 | 
			
		||||
@@ -39,5 +39,6 @@
 | 
			
		||||
      To begin the development, run `npm start` or `yarn start`.
 | 
			
		||||
      To create a production bundle, use `npm run build` or `yarn build`.
 | 
			
		||||
    -->
 | 
			
		||||
    <script type="module" src="/src/index.tsx"></script>
 | 
			
		||||
  </body>
 | 
			
		||||
</html>
 | 
			
		||||
							
								
								
									
										2338
									
								
								virtweb_frontend/package-lock.json
									
									
									
										generated
									
									
									
								
							
							
						
						
									
										2338
									
								
								virtweb_frontend/package-lock.json
									
									
									
										generated
									
									
									
								
							
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							@@ -1,6 +1,7 @@
 | 
			
		||||
{
 | 
			
		||||
  "name": "virtweb_frontend",
 | 
			
		||||
  "version": "0.1.0",
 | 
			
		||||
  "type": "module",
 | 
			
		||||
  "private": true,
 | 
			
		||||
  "dependencies": {
 | 
			
		||||
    "@emotion/react": "^11.11.1",
 | 
			
		||||
@@ -21,25 +22,26 @@
 | 
			
		||||
    "@types/react-dom": "^18.2.7",
 | 
			
		||||
    "@types/react-syntax-highlighter": "^15.5.11",
 | 
			
		||||
    "@types/uuid": "^9.0.5",
 | 
			
		||||
    "@vitejs/plugin-react": "^4.2.1",
 | 
			
		||||
    "filesize": "^10.0.12",
 | 
			
		||||
    "humanize-duration": "^3.29.0",
 | 
			
		||||
    "mui-file-input": "^3.0.1",
 | 
			
		||||
    "react": "^18.2.0",
 | 
			
		||||
    "react-dom": "^18.2.0",
 | 
			
		||||
    "react-router-dom": "^6.15.0",
 | 
			
		||||
    "react-scripts": "5.0.1",
 | 
			
		||||
    "react-syntax-highlighter": "^15.5.0",
 | 
			
		||||
    "react-vnc": "^1.0.0",
 | 
			
		||||
    "typescript": "^4.9.5",
 | 
			
		||||
    "uuid": "^9.0.1",
 | 
			
		||||
    "vite": "^5.0.8",
 | 
			
		||||
    "vite-tsconfig-paths": "^4.2.2",
 | 
			
		||||
    "web-vitals": "^2.1.4",
 | 
			
		||||
    "xml-formatter": "^3.6.0"
 | 
			
		||||
  },
 | 
			
		||||
  "scripts": {
 | 
			
		||||
    "start": "react-scripts start",
 | 
			
		||||
    "build": "react-scripts build",
 | 
			
		||||
    "test": "react-scripts test",
 | 
			
		||||
    "eject": "react-scripts eject"
 | 
			
		||||
    "start": "vite",
 | 
			
		||||
    "build": "tsc && vite build",
 | 
			
		||||
    "preview": "vite preview"
 | 
			
		||||
  },
 | 
			
		||||
  "eslintConfig": {
 | 
			
		||||
    "extends": [
 | 
			
		||||
 
 | 
			
		||||
@@ -26,7 +26,7 @@ export class APIClient {
 | 
			
		||||
   * Get backend URL
 | 
			
		||||
   */
 | 
			
		||||
  static backendURL(): string {
 | 
			
		||||
    const URL = process.env.REACT_APP_BACKEND ?? "";
 | 
			
		||||
    const URL = import.meta.env.VITE_APP_BACKEND ?? "";
 | 
			
		||||
    if (URL.length === 0) throw new Error("Backend URL undefined!");
 | 
			
		||||
    return URL;
 | 
			
		||||
  }
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										1
									
								
								virtweb_frontend/src/react-app-env.d.ts
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										1
									
								
								virtweb_frontend/src/react-app-env.d.ts
									
									
									
									
										vendored
									
									
								
							@@ -1 +0,0 @@
 | 
			
		||||
/// <reference types="react-scripts" />
 | 
			
		||||
@@ -9,7 +9,7 @@ export function VMScreenshot(p: { vm: VMInfo }): React.ReactElement {
 | 
			
		||||
    string | undefined
 | 
			
		||||
  >();
 | 
			
		||||
 | 
			
		||||
  const int = React.useRef<NodeJS.Timer | undefined>();
 | 
			
		||||
  const int = React.useRef<number | undefined>();
 | 
			
		||||
 | 
			
		||||
  React.useEffect(() => {
 | 
			
		||||
    const refresh = async () => {
 | 
			
		||||
 
 | 
			
		||||
@@ -1,11 +1,12 @@
 | 
			
		||||
{
 | 
			
		||||
  "compilerOptions": {
 | 
			
		||||
    "target": "es5",
 | 
			
		||||
    "lib": [
 | 
			
		||||
      "dom",
 | 
			
		||||
      "dom.iterable",
 | 
			
		||||
      "esnext"
 | 
			
		||||
    ],
 | 
			
		||||
    "target": "ESNext",
 | 
			
		||||
    "types": ["vite/client"],
 | 
			
		||||
    "allowJs": true,
 | 
			
		||||
    "skipLibCheck": true,
 | 
			
		||||
    "esModuleInterop": true,
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										1
									
								
								virtweb_frontend/vite-env.d.ts
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										1
									
								
								virtweb_frontend/vite-env.d.ts
									
									
									
									
										vendored
									
									
										Normal file
									
								
							@@ -0,0 +1 @@
 | 
			
		||||
/// <reference types="vite/client" />
 | 
			
		||||
							
								
								
									
										15
									
								
								virtweb_frontend/vite.config.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										15
									
								
								virtweb_frontend/vite.config.ts
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,15 @@
 | 
			
		||||
import { defineConfig } from "vite";
 | 
			
		||||
import react from "@vitejs/plugin-react";
 | 
			
		||||
import viteTsconfigPaths from "vite-tsconfig-paths";
 | 
			
		||||
 | 
			
		||||
export default defineConfig({
 | 
			
		||||
  // depending on your application, base can also be "/"
 | 
			
		||||
  base: "/",
 | 
			
		||||
  plugins: [react(), viteTsconfigPaths()],
 | 
			
		||||
  server: {
 | 
			
		||||
    // this ensures that the browser opens upon server start
 | 
			
		||||
    open: true,
 | 
			
		||||
    // this sets a default port to 3000
 | 
			
		||||
    port: 3000,
 | 
			
		||||
  },
 | 
			
		||||
});
 | 
			
		||||
		Reference in New Issue
	
	Block a user