Add local monaco editor instead of relying on cdn

Author: K0IN

frontend/package-lock.json

@@ -39,7 +39,8 @@
         "prettier": "^3.2.5",
         "typescript": "~5.4.0",
         "vite": "^5.3.1",
+        "vite-plugin-monaco-editor": "^1.1.0",
         "vite-plugin-vue-devtools": "^7.3.1",
         "vue-tsc": "^2.0.21"
     }
-}
+}

frontend/package.json

@@ -4,19 +4,34 @@ import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import vueJsx from '@vitejs/plugin-vue-jsx'
 import vueDevTools from 'vite-plugin-vue-devtools'
+import monacoEditorPlugin from 'vite-plugin-monaco-editor'
 
 // https://vitejs.dev/config/
 export default defineConfig({
     plugins: [
         vue(),
         vueJsx(),
         vueDevTools(),
+        (monacoEditorPlugin as any).default({
+            languageWorkers: ['editorWorkerService', 'typescript', 'json', 'html', 'css']
+        })
     ],
+    define: {
+        // Define Monaco Editor worker paths
+        'process.env': {}
+    },
     resolve: {
         alias: {
             '@': fileURLToPath(new URL('./src', import.meta.url))
         }
     },
+    optimizeDeps: {
+        include: [
+            'monaco-editor/esm/vs/editor/editor.api',
+            'monaco-editor/esm/vs/editor/editor.worker',
+            'monaco-editor/esm/vs/language/typescript/ts.worker'
+        ]
+    },
     build: {
         minify: 'terser',
         terserOptions: {
@@ -28,12 +43,18 @@ export default defineConfig({
             output: {
                 entryFileNames: `assets/[name].js`,
                 chunkFileNames: `assets/[name].js`,
-                assetFileNames: `assets/[name].[ext]`
+                assetFileNames: (assetInfo) => {
+                    if (assetInfo.name?.endsWith('.ttf') || assetInfo.name?.endsWith('.woff') || assetInfo.name?.endsWith('.woff2')) {
+                        return 'assets/fonts/[name].[ext]';
+                    }
+                    return 'assets/[name].[ext]';
+                }
             }
         },
         sourcemap: true,
         outDir: 'dist',
         emptyOutDir: true,
         target: 'esnext',
+        assetsInlineLimit: 0, // Don't inline assets, keep them as separate files
     }
 })