Browse Source
Split monolithic vite.config.mjs into separate config files: - vite.config.web.mts - vite.config.electron.mts - vite.config.capacitor.mts - vite.config.pywebview.mts - vite.config.common.mts - vite.config.utils.mts Updates: - Modify package.json scripts to use specific config files - Add electron-builder as dev dependency - Update electron build configuration - Fix electron resource paths - Remove old vite.config.mjs and utils.js This change improves maintainability by: - Separating concerns for different build targets - Making build configurations more explicit - Reducing complexity in individual config files
Matthew Raymer
9 months ago
14 changed files with 2884 additions and 240 deletions
@ -0,0 +1,29 @@ |
|||
const { app, BrowserWindow } = require('electron'); |
|||
const path = require('path'); |
|||
|
|||
function createWindow() { |
|||
const win = new BrowserWindow({ |
|||
width: 1200, |
|||
height: 800, |
|||
webPreferences: { |
|||
nodeIntegration: true, |
|||
contextIsolation: false |
|||
} |
|||
}); |
|||
|
|||
win.loadFile(path.join(__dirname, 'dist-electron/www/index.html')); |
|||
} |
|||
|
|||
app.whenReady().then(createWindow); |
|||
|
|||
app.on('window-all-closed', () => { |
|||
if (process.platform !== 'darwin') { |
|||
app.quit(); |
|||
} |
|||
}); |
|||
|
|||
app.on('activate', () => { |
|||
if (BrowserWindow.getAllWindows().length === 0) { |
|||
createWindow(); |
|||
} |
|||
}); |
|||
File diff suppressed because it is too large
@ -0,0 +1,16 @@ |
|||
import { initializeApp } from "./main.common"; |
|||
import { App } from "@capacitor/app"; |
|||
import router from "./router"; |
|||
|
|||
const app = initializeApp(); |
|||
|
|||
// Handle deep links
|
|||
App.addListener("appUrlOpen", (data: { url: string }) => { |
|||
console.log("Deep link opened:", data.url); |
|||
const slug = data.url.replace("timesafari://", ""); |
|||
if (slug) { |
|||
router.push("/" + slug); |
|||
} |
|||
}); |
|||
|
|||
app.mount("#app"); |
|||
@ -0,0 +1,40 @@ |
|||
import { createPinia } from "pinia"; |
|||
import { App as VueApp, ComponentPublicInstance, createApp } from "vue"; |
|||
import App from "./App.vue"; |
|||
import router from "./router"; |
|||
import axios from "axios"; |
|||
import VueAxios from "vue-axios"; |
|||
import Notifications from "notiwind"; |
|||
import "./assets/styles/tailwind.css"; |
|||
import { FontAwesomeIcon } from "./lib/fontawesome"; |
|||
import Camera from "simple-vue-camera"; |
|||
|
|||
// Global Error Handler
|
|||
function setupGlobalErrorHandler(app: VueApp) { |
|||
app.config.errorHandler = ( |
|||
err: unknown, |
|||
instance: ComponentPublicInstance | null, |
|||
info: string |
|||
) => { |
|||
console.error("Ouch! Global Error Handler.", err, info, instance); |
|||
alert( |
|||
(err instanceof Error ? err.message : "Something bad happened") + |
|||
" - Try reloading or restarting the app." |
|||
); |
|||
}; |
|||
} |
|||
|
|||
// Function to initialize the app
|
|||
export function initializeApp() { |
|||
const app = createApp(App) |
|||
.component("fa", FontAwesomeIcon) |
|||
.component("camera", Camera) |
|||
.use(createPinia()) |
|||
.use(VueAxios, axios) |
|||
.use(router) |
|||
.use(Notifications); |
|||
|
|||
setupGlobalErrorHandler(app); |
|||
|
|||
return app; |
|||
} |
|||
@ -0,0 +1,5 @@ |
|||
import { initializeApp } from "./main.common"; |
|||
import "./registerServiceWorker"; // Web PWA support
|
|||
|
|||
const app = initializeApp(); |
|||
app.mount("#app"); |
|||
@ -0,0 +1,4 @@ |
|||
import { defineConfig } from "vite"; |
|||
import { createBuildConfig } from "./vite.config.common.mts"; |
|||
|
|||
export default defineConfig(async () => createBuildConfig('capacitor')); |
|||
@ -0,0 +1,55 @@ |
|||
import { defineConfig } from "vite"; |
|||
import vue from "@vitejs/plugin-vue"; |
|||
import dotenv from "dotenv"; |
|||
import { loadAppConfig } from "./vite.config.utils.mts"; |
|||
import path from "path"; |
|||
import { fileURLToPath } from 'url'; |
|||
|
|||
// Load environment variables |
|||
dotenv.config(); |
|||
|
|||
const __filename = fileURLToPath(import.meta.url); |
|||
const __dirname = path.dirname(__filename); |
|||
|
|||
export async function createBuildConfig(mode: string) { |
|||
const appConfig = await loadAppConfig(); |
|||
const isElectron = mode === "electron"; |
|||
const isCapacitor = mode === "capacitor"; |
|||
const isPyWebView = mode === "pywebview"; |
|||
|
|||
if (isElectron || isPyWebView) { |
|||
process.env.VITE_PWA_ENABLED = 'false'; |
|||
} |
|||
|
|||
return { |
|||
base: isElectron || isPyWebView ? "./" : "/", |
|||
plugins: [vue()], |
|||
server: { |
|||
port: parseInt(process.env.VITE_PORT || "8080"), |
|||
fs: { strict: false }, |
|||
}, |
|||
build: { |
|||
outDir: isElectron ? "dist-electron" : "dist", |
|||
assetsDir: 'assets', |
|||
chunkSizeWarningLimit: 1000 |
|||
}, |
|||
define: { |
|||
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV), |
|||
'process.env.VITE_PWA_ENABLED': JSON.stringify(!(isElectron || isPyWebView)), |
|||
__dirname: isElectron ? JSON.stringify(process.cwd()) : '""', |
|||
}, |
|||
resolve: { |
|||
alias: appConfig.aliasConfig |
|||
}, |
|||
optimizeDeps: { |
|||
exclude: isElectron ? [ |
|||
'register-service-worker', |
|||
'workbox-window', |
|||
'web-push', |
|||
'serviceworker-webpack-plugin' |
|||
] : [] |
|||
} |
|||
}; |
|||
} |
|||
|
|||
export default defineConfig(async () => createBuildConfig('web')); |
|||
@ -0,0 +1,29 @@ |
|||
import { defineConfig, mergeConfig } from "vite"; |
|||
import { createBuildConfig } from "./vite.config.common.mts"; |
|||
|
|||
export default defineConfig(async () => { |
|||
const baseConfig = await createBuildConfig('electron'); |
|||
|
|||
return mergeConfig(baseConfig, { |
|||
plugins: [{ |
|||
name: 'remove-sw-imports', |
|||
transform(code: string, id: string) { |
|||
if ( |
|||
id.includes('registerServiceWorker') || |
|||
id.includes('register-service-worker') || |
|||
id.includes('sw_scripts') || |
|||
id.includes('PushNotificationPermission') || |
|||
code.includes('navigator.serviceWorker') |
|||
) { |
|||
return { |
|||
code: code |
|||
.replace(/import.*registerServiceWorker.*$/mg, '') |
|||
.replace(/import.*register-service-worker.*$/mg, '') |
|||
.replace(/navigator\.serviceWorker/g, 'undefined') |
|||
.replace(/if\s*\([^)]*serviceWorker[^)]*\)\s*{[^}]*}/g, '') |
|||
}; |
|||
} |
|||
} |
|||
}] |
|||
}); |
|||
}); |
|||
@ -1,120 +0,0 @@ |
|||
import { defineConfig } from "vite"; |
|||
import { VitePWA } from "vite-plugin-pwa"; |
|||
import vue from "@vitejs/plugin-vue"; |
|||
import dotenv from "dotenv"; |
|||
import { loadAppConfig } from "./vite.config.utils"; |
|||
import path from "path"; |
|||
import { fileURLToPath } from 'url'; |
|||
|
|||
// Load environment variables from .env file
|
|||
dotenv.config(); |
|||
|
|||
// Get dirname in ESM context
|
|||
const __filename = fileURLToPath(import.meta.url); |
|||
const __dirname = path.dirname(__filename); |
|||
|
|||
// Load application configuration
|
|||
const appConfig = loadAppConfig(); |
|||
|
|||
export default defineConfig(({ mode }) => { |
|||
const isElectron = mode === "electron"; |
|||
const isCapacitor = mode === "capacitor"; |
|||
const isPyWebView = mode === "pywebview"; |
|||
|
|||
// Disable PWA features for desktop builds
|
|||
if (isElectron || isPyWebView) { |
|||
process.env.VITE_PWA_ENABLED = 'false'; |
|||
} |
|||
|
|||
return { |
|||
base: isElectron || isPyWebView ? "./" : "/", |
|||
server: { |
|||
port: process.env.VITE_PORT || 8080, |
|||
fs: { |
|||
strict: false |
|||
}, |
|||
}, |
|||
build: { |
|||
outDir: isElectron ? "dist-electron" : "dist", |
|||
assetsDir: 'assets', |
|||
rollupOptions: { |
|||
external: ['electron', 'path'], |
|||
input: { |
|||
main: path.resolve(__dirname, 'index.html') |
|||
}, |
|||
output: { |
|||
manualChunks(id) { |
|||
if (isElectron && ( |
|||
id.includes('registerServiceWorker') || |
|||
id.includes('register-service-worker') || |
|||
id.includes('workbox') || |
|||
id.includes('sw_scripts') || |
|||
id.includes('PushNotificationPermission') |
|||
)) { |
|||
return null; // Exclude these modules completely
|
|||
} |
|||
} |
|||
} |
|||
}, |
|||
chunkSizeWarningLimit: 1000 |
|||
}, |
|||
define: { |
|||
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV), |
|||
'process.env.VITE_PWA_ENABLED': JSON.stringify(!(isElectron || isPyWebView)), |
|||
__dirname: isElectron ? JSON.stringify(process.cwd()) : '""', |
|||
}, |
|||
plugins: [ |
|||
vue(), |
|||
{ |
|||
name: 'remove-sw-imports', |
|||
transform(code, id) { |
|||
if (isElectron) { |
|||
if ( |
|||
id.includes('registerServiceWorker') || |
|||
id.includes('register-service-worker') || |
|||
id.includes('sw_scripts') || |
|||
id.includes('PushNotificationPermission') || |
|||
code.includes('navigator.serviceWorker') |
|||
) { |
|||
return { |
|||
code: code |
|||
.replace(/import.*registerServiceWorker.*$/mg, '') |
|||
.replace(/import.*register-service-worker.*$/mg, '') |
|||
.replace(/navigator\.serviceWorker/g, 'undefined') |
|||
.replace(/if\s*\([^)]*serviceWorker[^)]*\)\s*{[^}]*}/g, '') |
|||
}; |
|||
} |
|||
} |
|||
} |
|||
}, |
|||
...(!isElectron && !isCapacitor ? [ |
|||
VitePWA({ |
|||
disable: true, |
|||
registerType: 'autoUpdate', |
|||
injectRegister: null, |
|||
workbox: { |
|||
cleanupOutdatedCaches: true, |
|||
skipWaiting: true, |
|||
clientsClaim: true, |
|||
sourcemap: true |
|||
}, |
|||
manifest: appConfig.pwaConfig?.manifest, |
|||
devOptions: { |
|||
enabled: false |
|||
} |
|||
}), |
|||
] : []), |
|||
], |
|||
resolve: { |
|||
alias: appConfig.aliasConfig |
|||
}, |
|||
optimizeDeps: { |
|||
exclude: isElectron ? [ |
|||
'register-service-worker', |
|||
'workbox-window', |
|||
'web-push', |
|||
'serviceworker-webpack-plugin' |
|||
] : [] |
|||
} |
|||
}; |
|||
}); |
|||
@ -0,0 +1,4 @@ |
|||
import { defineConfig } from "vite"; |
|||
import { createBuildConfig } from "./vite.config.common.mts"; |
|||
|
|||
export default defineConfig(async () => createBuildConfig('pywebview')); |
|||
@ -0,0 +1,27 @@ |
|||
import { defineConfig, mergeConfig } from "vite"; |
|||
import { VitePWA } from "vite-plugin-pwa"; |
|||
import { createBuildConfig } from "./vite.config.common.mts"; |
|||
import { loadAppConfig } from "./vite.config.utils.mts"; |
|||
|
|||
export default defineConfig(async () => { |
|||
const baseConfig = await createBuildConfig('web'); |
|||
const appConfig = await loadAppConfig(); |
|||
|
|||
return mergeConfig(baseConfig, { |
|||
plugins: [ |
|||
VitePWA({ |
|||
registerType: 'autoUpdate', |
|||
manifest: appConfig.pwaConfig?.manifest, |
|||
devOptions: { |
|||
enabled: false |
|||
}, |
|||
workbox: { |
|||
cleanupOutdatedCaches: true, |
|||
skipWaiting: true, |
|||
clientsClaim: true, |
|||
sourcemap: true |
|||
} |
|||
}) |
|||
] |
|||
}); |
|||
}); |
|||
Loading…
Reference in new issue