Merge f41675b7cb into 6ffdbf074d

frontend/vite.config.js

@@ -1,4 +1,4 @@
-import { defineConfig } from "vite"
+import { defineConfig, loadEnv } from "vite"
 import { fileURLToPath, URL } from "url"
 import postcss from "./postcss.config.js"
 import react from "@vitejs/plugin-react"
@@ -8,80 +8,91 @@ import { visualizer } from "rollup-plugin-visualizer"
 dns.setDefaultResultOrder("verbatim")
 
 // https://vitejs.dev/config/
-export default defineConfig({
-  assetsInclude: [
-    './public/piper/ort-wasm-simd-threaded.wasm',
-    './public/piper/piper_phonemize.wasm',
-    './public/piper/piper_phonemize.data',
-  ],
-  worker: {
-    format: 'es'
-  },
-  server: {
-    port: 3000,
-    host: "localhost"
-  },
-  define: {
-    "process.env": process.env
-  },
-  css: {
-    postcss
-  },
-  plugins: [
-    react(),
-    visualizer({
-      template: "treemap", // or sunburst
-      open: false,
-      gzipSize: true,
-      brotliSize: true,
-      filename: "bundleinspector.html" // will be saved in project's root
-    })
-  ],
-  resolve: {
-    alias: [
-      {
-        find: "@",
-        replacement: fileURLToPath(new URL("./src", import.meta.url))
-      },
-      {
-        process: "process/browser",
-        stream: "stream-browserify",
-        zlib: "browserify-zlib",
-        util: "util",
-        find: /^~.+/,
-        replacement: (val) => {
-          return val.replace(/^~/, "")
+export default defineConfig(({ mode })=> {
+  const env = loadEnv(mode, process.cwd());
+  return {
+    assetsInclude: [
+      './public/piper/ort-wasm-simd-threaded.wasm',
+      './public/piper/piper_phonemize.wasm',
+      './public/piper/piper_phonemize.data',
+    ],
+    worker: {
+      format: 'es'
+    },
+    server: {
+      port: 3000,
+      host: '0.0.0.0',
+      proxy: {
+        [env.VITE_API_BASE]: {
+          target: 'http://localhost:3001', // Address of the back-end server
+          changeOrigin: true,
+          ws: true,
+          rewrite: (path) => path
         }
       }
-    ]
-  },
-  build: {
-    rollupOptions: {
-      output: {
-        // These settings ensure the primary JS and CSS file references are always index.{js,css}
-        // so we can SSR the index.html as text response from server/index.js without breaking references each build.
-        entryFileNames: 'index.js',
-        assetFileNames: (assetInfo) => {
-          if (assetInfo.name === 'index.css') return `index.css`;
-          return assetInfo.name;
+    },
+    define: {
+      "process.env": process.env
+    },
+    css: {
+      postcss
+    },
+    plugins: [
+      react(),
+      visualizer({
+        template: "treemap", // or sunburst
+        open: false,
+        gzipSize: true,
+        brotliSize: true,
+        filename: "bundleinspector.html" // will be saved in project's root
+      })
+    ],
+    resolve: {
+      alias: [
+        {
+          find: "@",
+          replacement: fileURLToPath(new URL("./src", import.meta.url))
         },
-      },
-      external: [
-        // Reduces transformation time by 50% and we don't even use this variant, so we can ignore.
-        /@phosphor-icons\/react\/dist\/ssr/,
+        {
+          process: "process/browser",
+          stream: "stream-browserify",
+          zlib: "browserify-zlib",
+          util: "util",
+          find: /^~.+/,
+          replacement: (val) => {
+            return val.replace(/^~/, "")
+          }
+        }
       ]
     },
-    commonjsOptions: {
-      transformMixedEsModules: true
-    }
-  },
-  optimizeDeps: {
-    include: ["@mintplex-labs/piper-tts-web"],
-    esbuildOptions: {
-      define: {
-        global: "globalThis"
+    build: {
+      rollupOptions: {
+        output: {
+          // These settings ensure the primary JS and CSS file references are always index.{js,css}
+          // so we can SSR the index.html as text response from server/index.js without breaking references each build.
+          entryFileNames: 'index.js',
+          assetFileNames: (assetInfo) => {
+            if (assetInfo.name === 'index.css') return `index.css`;
+            return assetInfo.name;
+          },
+        },
+        external: [
+          // Reduces transformation time by 50% and we don't even use this variant, so we can ignore.
+          /@phosphor-icons\/react\/dist\/ssr/,
+        ]
       },
-      plugins: []
+      commonjsOptions: {
+        transformMixedEsModules: true
+      }
+    },
+    optimizeDeps: {
+      include: ["@mintplex-labs/piper-tts-web"],
+      esbuildOptions: {
+        define: {
+          global: "globalThis"
+        },
+        plugins: []
+      }
     }
   }
 })

pnpm-lock.yaml

@@ -0,0 +1,9 @@
+lockfileVersion: '9.0'
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
+
+importers:
+
+  .: {}