Update

frontend/components/Navbar.vue

@@ -1,6 +1,7 @@
 <template>
     <v-app-bar fixed app color="primary" dark>
         <v-btn to="/" text rounded>Simple Notes</v-btn>
+        <v-btn to="/" text rounded>{{ $colorMode.value }}</v-btn>
         <v-spacer />
         <client-only>
             <v-btn aria-label="theme switcher" icon @click="toggleTheme">

frontend/nuxt.config.js

@@ -1,5 +1,7 @@
 import colors from 'vuetify/es5/util/colors'
-const env = require('dotenv').config().parsed
+import { config } from 'dotenv'
+
+const env = config().parsed
 
 export default {
     mode: 'universal',
@@ -54,6 +56,7 @@ export default {
         // Doc: https://github.com/nuxt-community/eslint-module
         '@nuxtjs/vuetify',
         '@nuxtjs/eslint-module',
+        '@nuxtjs/color-mode',
     ],
     /*
      ** Nuxt.js modules
@@ -154,6 +157,31 @@ export default {
      */
     build: {
         extractCSS: true,
+
+        terser: {
+            parallel: true,
+            cache: false,
+            sourceMap: false,
+            extractComments: false,
+            terserOptions: {},
+        },
+
+        html: {
+            minify: {
+                collapseBooleanAttributes: true,
+                decodeEntities: true,
+                minifyCSS: true,
+                minifyJS: true,
+                processConditionalComments: true,
+                removeEmptyAttributes: true,
+                removeRedundantAttributes: true,
+                trimCustomFragments: true,
+                useShortDoctype: true,
+                collapseWhitespace: true,
+                removeComments: true,
+            },
+        },
+
         /*
          ** You can extend webpack config here
          */

frontend/package.json

@@ -8,7 +8,7 @@
     "dev": "nuxt",
     "build": "nuxt build",
     "start": "nuxt start",
-    "generate": "nuxt generate",
+    "generate": "nuxt generate --modern",
     "serve": "caddy run",
     "lint": "eslint --ext .js,.vue --ignore-path .gitignore ."
   },