mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-01-26 19:09:52 +00:00
## Summary - Enable `verbatimModuleSyntax` compiler option in TypeScript configuration - Update all type imports to use explicit `import type` syntax - This change will Improve tree-shaking and bundler compatibility ## Motivation The `verbatimModuleSyntax` option ensures that type-only imports are explicitly marked with the `type` keyword. This: - Makes import/export intentions clearer - Improves tree-shaking by helping bundlers identify what can be safely removed - Ensures better compatibility with modern bundlers - Follows TypeScript best practices for module syntax ## Changes - Added `"verbatimModuleSyntax": true` to `tsconfig.json` - Updated another 48+ files to use explicit `import type` syntax for type-only imports - No functional changes, only import/export syntax improvements ## Test Plan - [x] TypeScript compilation passes - [x] Build completes successfully - [x] Tests pass - [ ] No runtime behavior changes 🤖 Generated with [Claude Code](https://claude.ai/code) ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-5533-feat-enable-verbatimModuleSyntax-in-TypeScript-config-26d6d73d36508190b424ef9b379b5130) by [Unito](https://www.unito.io)
83 lines
2.2 KiB
TypeScript
83 lines
2.2 KiB
TypeScript
import path from 'path'
|
|
import type { Plugin } from 'vite'
|
|
|
|
interface ShimResult {
|
|
code: string
|
|
exports: string[]
|
|
}
|
|
|
|
function isLegacyFile(id: string): boolean {
|
|
return (
|
|
id.endsWith('.ts') &&
|
|
(id.includes('src/extensions/core') || id.includes('src/scripts'))
|
|
)
|
|
}
|
|
|
|
function transformExports(code: string, id: string): ShimResult {
|
|
const moduleName = getModuleName(id)
|
|
const exports: string[] = []
|
|
let newCode = code
|
|
|
|
// Regex to match different types of exports
|
|
const regex =
|
|
/export\s+(const|let|var|function|class|async function)\s+([a-zA-Z$_][a-zA-Z\d$_]*)(\s|\()/g
|
|
let match
|
|
|
|
while ((match = regex.exec(code)) !== null) {
|
|
const name = match[2]
|
|
// All exports should be bind to the window object as new API endpoint.
|
|
if (exports.length == 0) {
|
|
newCode += `\nwindow.comfyAPI = window.comfyAPI || {};`
|
|
newCode += `\nwindow.comfyAPI.${moduleName} = window.comfyAPI.${moduleName} || {};`
|
|
}
|
|
newCode += `\nwindow.comfyAPI.${moduleName}.${name} = ${name};`
|
|
exports.push(
|
|
`export const ${name} = window.comfyAPI.${moduleName}.${name};\n`
|
|
)
|
|
}
|
|
|
|
return {
|
|
code: newCode,
|
|
exports
|
|
}
|
|
}
|
|
|
|
function getModuleName(id: string): string {
|
|
// Simple example to derive a module name from the file path
|
|
const parts = id.split('/')
|
|
const fileName = parts[parts.length - 1]
|
|
return fileName.replace(/\.\w+$/, '') // Remove file extension
|
|
}
|
|
|
|
export function comfyAPIPlugin(isDev: boolean): Plugin {
|
|
return {
|
|
name: 'comfy-api-plugin',
|
|
transform(code: string, id: string) {
|
|
if (isDev) return null
|
|
|
|
if (isLegacyFile(id)) {
|
|
const result = transformExports(code, id)
|
|
|
|
if (result.exports.length > 0) {
|
|
const projectRoot = process.cwd()
|
|
const relativePath = path.relative(path.join(projectRoot, 'src'), id)
|
|
const shimFileName = relativePath.replace(/\.ts$/, '.js')
|
|
|
|
const shimComment = `// Shim for ${relativePath}\n`
|
|
|
|
this.emitFile({
|
|
type: 'asset',
|
|
fileName: shimFileName,
|
|
source: shimComment + result.exports.join('')
|
|
})
|
|
}
|
|
|
|
return {
|
|
code: result.code,
|
|
map: null // If you're not modifying the source map, return null
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|