Merge pull request #240 from WatchItDev/migrate/webpack/to/vite

refactor: migrate from webpack to vitejs bundler
WatchItDev · Nov 5, 2024 · 84c09ac · 84c09ac
2 parents b16e20d + aa1c162
commit 84c09ac
Show file tree

Hide file tree

Showing 470 changed files with 19,921 additions and 38,385 deletions.
diff --git a/.eslintrc b/.eslintrc
diff --git a/Makefile b/Makefile
@@ -0,0 +1,27 @@
+# Include env file
+ifneq (,$(wildcard ./.env))
+    include .env
+    export
+endif
+
+.DEFAULT_GOAL := all
+MAKEFLAGS += --no-print-directory
+
+# When --ci option is provided, Jest will assume it is running in a CI environment.
+# This changes the behavior when a new snapshot is encountered. Instead of the regular behavior of storing a new snapshot automatically,
+# it will fail the test and require Jest to be run with --updateSnapshot.
+.PHONY: test ## run tests
+test:
+	npx jest --ci --verbose --coverage=false --passWithNoTests
+
+.PHONY: testcov ## run test coverage
+testcov:
+	npx jest --ci --coverage --passWithNoTests | tee ./coverage.txt
+
+.PHONY: install ## install dependencies
+install:
+	npm ci
+
+.PHONY: lint ## lint standard js
+lint:
+	npx eslint "src/**/*.{js,jsx,ts,tsx}"
diff --git a/estlint.config.js b/estlint.config.js
@@ -0,0 +1,28 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+
+export default tseslint.config(
+  { ignores: ['dist'] },
+  {
+    extends: [js.configs.recommended, ...tseslint.configs.recommended],
+    files: ['**/*.{ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+    plugins: {
+      'react-hooks': reactHooks,
+      'react-refresh': reactRefresh,
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      'react-refresh/only-export-components': [
+        'warn',
+        { allowConstantExport: true },
+      ],
+    },
+  },
+)
diff --git a/public/index.html → index.html b/public/index.html → index.html
@@ -5,31 +5,29 @@
   <meta charset="utf-8" />
   <meta name="theme-color" content="#000000" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
-  <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+  <link rel="manifest" href="./manifest.json" />
 
   <!-- Favicon -->
-  <link rel="icon" href="%PUBLIC_URL%/favicon/favicon.ico">
-  <link rel="icon" type="image/png" sizes="16x16" href="%PUBLIC_URL%/favicon/favicon-16x16.png">
-  <link rel="icon" type="image/png" sizes="32x32" href="%PUBLIC_URL%/favicon/favicon-32x32.png">
-  <link rel="apple-touch-icon" sizes="180x180" href="%PUBLIC_URL%/favicon/apple-touch-icon.png">
+  <link rel="icon" href="./favicon/favicon.ico">
+  <link rel="icon" type="image/png" sizes="16x16" href="./favicon/favicon-16x16.png">
+  <link rel="icon" type="image/png" sizes="32x32" href="./favicon/favicon-32x32.png">
+  <link rel="apple-touch-icon" sizes="180x180" href="./favicon/apple-touch-icon.png">
 
   <!-- Using Google Font -->
   <link rel="preconnect" href="https://fonts.googleapis.com" />
   <link rel="preconnect" href="https://fonts.gstatic.com" />
   <link href="https://fonts.googleapis.com/css2?family=Public+Sans:wght@400;500;600;700;800&display=swap"
-    rel="stylesheet" />
+        rel="stylesheet" />
   <link href="https://fonts.googleapis.com/css2?family=Barlow:wght@900&display=swap" rel="stylesheet" />
 
-  <title>Watchit app</title>
+  <title>Watchit App</title>
 
   <meta name="description"
-    content="" />
+        content="" />
   <meta name="keywords" content="react,material,kit,application,dashboard,admin,template" />
 </head>
-
 <body>
-  <noscript>You need to enable JavaScript to run this app.</noscript>
-  <div id="root"></div>
+<div id="root"></div>
+<script type="module" src="./src/index.tsx"></script>
 </body>
-
 </html>