mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-01-26 19:09:52 +00:00
07a74e3cdc
## Summary Extracts desktop UI into apps/desktop-ui package with minimal changes. ## Changes - **What**: - Separates desktop-specific code into standalone package with independent Vite config, router, and i18n - Drastically simplifies the main app router by removing all desktop routes - Adds a some code duplication, most due to the existing design - Some duplication can be refactored to be *simpler* on either side - no need to split things by `isElectron()` - Rudimentary storybook support has been added - **Breaking**: Stacked PR for publishing must be merged before this PR makes it to stable core (but publishing _could_ be done manually) - #5915 - **Dependencies**: Takes full advantage of pnpm catalog. No additional dependencies added. ## Review Focus - Should be no changes to normal frontend operation - Scripts added to root package.json are acceptable - The duplication in this PR is copied as is, wherever possible. Any corrections or fix-ups beyond the scope of simply migrating the functionality as-is, can be addressed in later PRs. That said, if any changes are made, it instantly becomes more difficult to separate the duplicated code out into a shared utility. - Tracking issue to address concerns: #5925 ### i18n Fixing i18n is out of scope for this PR. It is a larger task that we should consider carefully and implement properly. Attempting to isolate the desktop i18n and duplicate the _current_ localisation scripts would be wasted energy.
73 lines
2.1 KiB
TypeScript
73 lines
2.1 KiB
TypeScript
import tailwindcss from '@tailwindcss/vite'
|
|
import vue from '@vitejs/plugin-vue'
|
|
import dotenv from 'dotenv'
|
|
import path from 'node:path'
|
|
import { fileURLToPath } from 'node:url'
|
|
import { FileSystemIconLoader } from 'unplugin-icons/loaders'
|
|
import IconsResolver from 'unplugin-icons/resolver'
|
|
import Icons from 'unplugin-icons/vite'
|
|
import Components from 'unplugin-vue-components/vite'
|
|
import { defineConfig } from 'vite'
|
|
import { createHtmlPlugin } from 'vite-plugin-html'
|
|
import vueDevTools from 'vite-plugin-vue-devtools'
|
|
|
|
dotenv.config()
|
|
|
|
const projectRoot = fileURLToPath(new URL('.', import.meta.url))
|
|
|
|
const SHOULD_MINIFY = process.env.ENABLE_MINIFY === 'true'
|
|
const VITE_REMOTE_DEV = process.env.VITE_REMOTE_DEV === 'true'
|
|
const DISABLE_VUE_PLUGINS = process.env.DISABLE_VUE_PLUGINS === 'true'
|
|
|
|
export default defineConfig(() => {
|
|
return {
|
|
root: projectRoot,
|
|
base: '',
|
|
publicDir: path.resolve(projectRoot, 'public'),
|
|
server: {
|
|
port: 5174,
|
|
host: VITE_REMOTE_DEV ? '0.0.0.0' : undefined
|
|
},
|
|
resolve: {
|
|
alias: {
|
|
'@': path.resolve(projectRoot, 'src'),
|
|
'@frontend-locales': path.resolve(projectRoot, '../../src/locales')
|
|
}
|
|
},
|
|
plugins: [
|
|
...(!DISABLE_VUE_PLUGINS
|
|
? [vueDevTools(), vue(), createHtmlPlugin({})]
|
|
: [vue()]),
|
|
tailwindcss(),
|
|
Icons({
|
|
compiler: 'vue3',
|
|
customCollections: {
|
|
comfy: FileSystemIconLoader(
|
|
path.resolve(projectRoot, '../../packages/design-system/src/icons')
|
|
)
|
|
}
|
|
}),
|
|
Components({
|
|
dts: path.resolve(projectRoot, 'components.d.ts'),
|
|
resolvers: [
|
|
IconsResolver({
|
|
customCollections: ['comfy']
|
|
})
|
|
],
|
|
dirs: [
|
|
path.resolve(projectRoot, 'src/components'),
|
|
path.resolve(projectRoot, 'src/views')
|
|
],
|
|
deep: true,
|
|
extensions: ['vue'],
|
|
directoryAsNamespace: true
|
|
})
|
|
],
|
|
build: {
|
|
minify: SHOULD_MINIFY ? ('esbuild' as const) : false,
|
|
target: 'es2022',
|
|
sourcemap: true
|
|
}
|
|
}
|
|
})
|