update configuration to enable vuetify

.gitignore

@@ -30,4 +30,5 @@ coverage
 *.tsbuildinfo
 
 # Local configuration file
-/src/config.js
+/src/config.js
+/components.d.ts

package.json

@@ -11,8 +11,9 @@
     "format": "prettier --write src/"
   },
   "dependencies": {
-    "@vue/cli": "^5.0.8",
+    "@mdi/font": "^7.4.47",
     "mqtt": "^5.3.5",
+    "roboto-fontface": "^0.10.0",
     "vue": "^3.4.19",
     "vue-router": "^4.2.5"
   },
@@ -23,6 +24,9 @@
     "eslint": "^8.49.0",
     "eslint-plugin-vue": "^9.17.0",
     "prettier": "^3.0.3",
-    "vite": "^5.0.11"
+    "unplugin-fonts": "^1.1.1",
+    "unplugin-vue-components": "^0.26.0",
+    "vite": "^5.0.11",
+    "vite-plugin-vuetify": "^2.0.1"
   }
 }

vite.config.js

@@ -1,13 +1,31 @@
-import { fileURLToPath, URL } from 'node:url'
+// Plugins
-
+import Components from 'unplugin-vue-components/vite'
-import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
+import Vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
+import ViteFonts from 'unplugin-fonts/vite'
+
+// Utilities
+import { fileURLToPath, URL } from 'node:url'
+import { defineConfig } from 'vite'
 
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [
-    vue(),
+    vue({
+      template: { transformAssetUrls }
+    }),
+    Vuetify(),
+    Components(),
+    ViteFonts({
+      google: {
+        families: [{
+          name: 'Roboto',
+          styles: 'wght@100;300;400;500;700;900',
+        }]
+      }
+    }),
   ],
+  define: { 'process.env': {} },
   resolve: {
     alias: {
       '@': fileURLToPath(new URL('./src', import.meta.url))