Browse Source
- Simplify vite.config.web.mts to match working capacitor configuration - Remove complex mergeConfig() approach that was causing Vue compilation errors - Eliminate environment-specific build configurations that weren't needed - Fix "TypeError: Cannot read properties of undefined (reading 'on')" at App.vue:1 Problem: The web build was failing during Vue component compilation with a cryptic error at line 1 of App.vue. Investigation revealed the issue was in the overly complex Vite configuration that used mergeConfig() with environment-specific settings, while the working capacitor build used the simple direct approach. Solution: Simplified web config to use createBuildConfig('web') directly, matching the proven capacitor pattern. This eliminates the Vue compilation failure while preserving all functionality including deep links. Root cause: Complex build configuration was interfering with Vue's component processing, causing the .on() error during initial component registration. Files changed: - vite.config.web.mts: Simplified to match capacitor configuration pattern - vite.config.common.mts: Temporarily disabled ESBuild error handling (not root cause) Testing: Web app now loads successfully, Vue compilation completes, deep links preserved, and build architecture maintained.didview-invalid-did-handling
4 changed files with 1709 additions and 1680 deletions
File diff suppressed because it is too large
@ -1,110 +1,4 @@ |
|||||
import { defineConfig, mergeConfig } from "vite"; |
import { defineConfig } from "vite"; |
||||
import { createBuildConfig } from "./vite.config.common.mts"; |
import { createBuildConfig } from "./vite.config.common.mts"; |
||||
import { loadAppConfig } from "./vite.config.utils.mts"; |
|
||||
|
|
||||
export default defineConfig(async ({ mode }) => { |
export default defineConfig(async () => createBuildConfig('web')); |
||||
const baseConfig = await createBuildConfig('web'); |
|
||||
const appConfig = await loadAppConfig(); |
|
||||
|
|
||||
// Environment-specific configuration based on mode |
|
||||
const getEnvironmentConfig = (mode: string) => { |
|
||||
switch (mode) { |
|
||||
case 'production': |
|
||||
return { |
|
||||
// Production optimizations |
|
||||
build: { |
|
||||
minify: 'terser', |
|
||||
sourcemap: false, |
|
||||
rollupOptions: { |
|
||||
output: { |
|
||||
manualChunks: { |
|
||||
vendor: ['vue', 'vue-router', 'pinia'], |
|
||||
utils: ['luxon', 'ramda', 'zod'], |
|
||||
crypto: ['@ethersproject/wallet', '@ethersproject/hdnode', 'ethereum-cryptography'], |
|
||||
sql: ['@jlongster/sql.js', 'absurd-sql'] |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
define: { |
|
||||
__DEV__: false, |
|
||||
__TEST__: false, |
|
||||
__PROD__: true |
|
||||
} |
|
||||
}; |
|
||||
case 'test': |
|
||||
return { |
|
||||
// Test environment configuration |
|
||||
build: { |
|
||||
minify: false, |
|
||||
sourcemap: true, |
|
||||
rollupOptions: { |
|
||||
output: { |
|
||||
manualChunks: undefined |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
define: { |
|
||||
__DEV__: false, |
|
||||
__TEST__: true, |
|
||||
__PROD__: false |
|
||||
} |
|
||||
}; |
|
||||
default: // development |
|
||||
return { |
|
||||
// Development configuration |
|
||||
build: { |
|
||||
minify: false, |
|
||||
sourcemap: true, |
|
||||
rollupOptions: { |
|
||||
output: { |
|
||||
manualChunks: undefined |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
define: { |
|
||||
__DEV__: true, |
|
||||
__TEST__: false, |
|
||||
__PROD__: false |
|
||||
} |
|
||||
}; |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
const environmentConfig = getEnvironmentConfig(mode); |
|
||||
|
|
||||
return mergeConfig(baseConfig, { |
|
||||
...environmentConfig, |
|
||||
// Ensure source maps are enabled for development and test modes |
|
||||
// This affects both dev server and build output |
|
||||
sourcemap: mode === 'development' || mode === 'test', |
|
||||
// Server configuration inherited from base config |
|
||||
// CORS headers removed to allow images from any domain |
|
||||
plugins: [], |
|
||||
// Worker configuration for SQL worker |
|
||||
worker: { |
|
||||
format: 'es', |
|
||||
plugins: () => [] |
|
||||
}, |
|
||||
// Optimize dependencies for SQL worker |
|
||||
optimizeDeps: { |
|
||||
include: [ |
|
||||
'@jlongster/sql.js', |
|
||||
'absurd-sql', |
|
||||
'absurd-sql/dist/indexeddb-main-thread', |
|
||||
'absurd-sql/dist/indexeddb-backend' |
|
||||
] |
|
||||
}, |
|
||||
// ESBuild configuration to fail on errors |
|
||||
esbuild: { |
|
||||
target: 'es2015', |
|
||||
supported: { |
|
||||
'bigint': true |
|
||||
}, |
|
||||
// Fail on any ESBuild errors |
|
||||
logLevel: 'error', |
|
||||
// Ensure build fails on syntax errors |
|
||||
logOverride: { 'duplicate-export': 'error' } |
|
||||
} |
|
||||
}); |
|
||||
}); |
|
||||
|
Loading…
Reference in new issue