feat: 添加脚本编辑器配置和类型定义支持

packages/editor-app/src/App.tsx

@@ -381,6 +381,14 @@ function App() {
             // 设置 Tauri project:// 协议的基础路径（用于加载插件等项目文件）
             await TauriAPI.setProjectBasePath(projectPath);
 
+            // 复制类型定义到项目，用于 IDE 智能感知
+            // Copy type definitions to project for IDE intellisense
+            try {
+                await TauriAPI.copyTypeDefinitions(projectPath);
+            } catch (e) {
+                console.warn('[App] Failed to copy type definitions:', e);
+            }
+
             const settings = SettingsService.getInstance();
             settings.addRecentProject(projectPath);
 

packages/editor-app/src/api/tauri.ts

@@ -168,6 +168,26 @@ export class TauriAPI {
         await invoke('show_in_folder', { filePath: path });
     }
 
+    /**
+     * 使用指定编辑器打开项目
+     * Open project with specified editor
+     *
+     * @param projectPath 项目文件夹路径 | Project folder path
+     * @param editorCommand 编辑器命令（如 "code", "cursor"）| Editor command
+     * @param filePath 可选的要打开的文件路径 | Optional file path to open
+     */
+    static async openWithEditor(
+        projectPath: string,
+        editorCommand: string,
+        filePath?: string
+    ): Promise<void> {
+        await invoke('open_with_editor', {
+            projectPath,
+            editorCommand,
+            filePath: filePath || null
+        });
+    }
+
     /**
    * 打开行为树文件选择对话框
    * @returns 用户选择的文件路径，取消则返回 null
@@ -311,6 +331,16 @@ export class TauriAPI {
         return await invoke<string>('generate_qrcode', { text });
     }
 
+    /**
+     * 复制类型定义文件到项目
+     * Copy type definition files to project for IDE intellisense
+     *
+     * @param projectPath 项目路径 | Project path
+     */
+    static async copyTypeDefinitions(projectPath: string): Promise<void> {
+        return await invoke<void>('copy_type_definitions', { projectPath });
+    }
+
     /**
    * 将本地文件路径转换为 Tauri 可访问的 asset URL
    * @param filePath 本地文件路径

packages/editor-app/src/components/ContentBrowser.tsx

@@ -40,6 +40,7 @@ import {
 import { Core } from '@esengine/ecs-framework';
 import { MessageHub, FileActionRegistry, type FileCreationTemplate } from '@esengine/editor-core';
 import { TauriAPI, DirectoryEntry } from '../api/tauri';
+import { SettingsService } from '../services/SettingsService';
 import { ContextMenu, ContextMenuItem } from './ContextMenu';
 import { PromptDialog } from './PromptDialog';
 import '../styles/ContentBrowser.css';
@@ -210,8 +211,124 @@ export function ContentBrowser({
         'Shader': { en: 'Shader', zh: '着色器' },
         'Tilemap': { en: 'Tilemap', zh: '瓦片地图' },
         'Tileset': { en: 'Tileset', zh: '瓦片集' },
+        'Component': { en: 'Component', zh: '组件' },
+        'System': { en: 'System', zh: '系统' },
+        'TypeScript': { en: 'TypeScript', zh: 'TypeScript' },
     };
 
+    // 注册内置的 TypeScript 文件创建模板
+    // Register built-in TypeScript file creation templates
+    useEffect(() => {
+        if (!fileActionRegistry) return;
+
+        const builtinTemplates: FileCreationTemplate[] = [
+            {
+                id: 'ts-component',
+                label: 'Component',
+                extension: '.ts',
+                icon: 'FileCode',
+                category: 'Script',
+                getContent: (fileName: string) => {
+                    const className = fileName.replace(/\.ts$/, '');
+                    return `import { Component, ECSComponent, Property, Serialize, Serializable } from '@esengine/ecs-framework';
+
+/**
+ * ${className}
+ */
+@ECSComponent('${className}')
+@Serializable({ version: 1, typeId: '${className}' })
+export class ${className} extends Component {
+    // 在这里添加组件属性
+    // Add component properties here
+
+    @Serialize()
+    @Property({ type: 'number', label: 'Example Property' })
+    public exampleProperty: number = 0;
+
+    onInitialize(): void {
+        // 组件初始化时调用
+        // Called when component is initialized
+    }
+
+    onDestroy(): void {
+        // 组件销毁时调用
+        // Called when component is destroyed
+    }
+}
+`;
+                }
+            },
+            {
+                id: 'ts-system',
+                label: 'System',
+                extension: '.ts',
+                icon: 'FileCode',
+                category: 'Script',
+                getContent: (fileName: string) => {
+                    const className = fileName.replace(/\.ts$/, '');
+                    return `import { EntitySystem, Matcher, type Entity } from '@esengine/ecs-framework';
+
+/**
+ * ${className}
+ */
+export class ${className} extends EntitySystem {
+    // 定义系统处理的组件类型
+    // Define component types this system processes
+    protected getMatcher(): Matcher {
+        // 返回匹配器，指定需要哪些组件
+        // Return matcher specifying required components
+        // return Matcher.all(SomeComponent);
+        return Matcher.empty();
+    }
+
+    protected updateEntity(entity: Entity, deltaTime: number): void {
+        // 处理每个实体
+        // Process each entity
+    }
+
+    // 可选：系统初始化
+    // Optional: System initialization
+    // onInitialize(): void {
+    //     super.onInitialize();
+    // }
+}
+`;
+                }
+            },
+            {
+                id: 'ts-script',
+                label: 'TypeScript',
+                extension: '.ts',
+                icon: 'FileCode',
+                category: 'Script',
+                getContent: (fileName: string) => {
+                    const name = fileName.replace(/\.ts$/, '');
+                    return `/**
+ * ${name}
+ */
+
+export function ${name.charAt(0).toLowerCase() + name.slice(1)}(): void {
+    // 在这里编写代码
+    // Write your code here
+}
+`;
+                }
+            }
+        ];
+
+        // 注册模板
+        for (const template of builtinTemplates) {
+            fileActionRegistry.registerCreationTemplate(template);
+        }
+
+        // 清理函数
+        return () => {
+            for (const template of builtinTemplates) {
+                fileActionRegistry.unregisterCreationTemplate(template);
+            }
+        };
+    }, [fileActionRegistry]);
+
     const getTemplateLabel = (label: string): string => {
         const mapping = templateLabels[label];
         if (mapping) {
@@ -439,6 +556,24 @@ export function ContentBrowser({
                 return;
             }
 
+            // 脚本文件使用配置的编辑器打开
+            // Open script files with configured editor
+            if (ext === 'ts' || ext === 'tsx' || ext === 'js' || ext === 'jsx') {
+                const settings = SettingsService.getInstance();
+                const editorCommand = settings.getScriptEditorCommand();
+
+                if (editorCommand && projectPath) {
+                    try {
+                        await TauriAPI.openWithEditor(projectPath, editorCommand, asset.path);
+                        return;
+                    } catch (error) {
+                        console.error('Failed to open with editor:', error);
+                        // 如果失败，回退到系统默认应用
+                        // Fall back to system default app if failed
+                    }
+                }
+            }
+
             if (fileActionRegistry) {
                 const handled = await fileActionRegistry.handleDoubleClick(asset.path);
                 if (handled) return;
@@ -450,7 +585,7 @@ export function ContentBrowser({
                 console.error('Failed to open file:', error);
             }
         }
-    }, [loadAssets, onOpenScene, fileActionRegistry]);
+    }, [loadAssets, onOpenScene, fileActionRegistry, projectPath]);
 
     // Handle context menu
     const handleContextMenu = useCallback((e: React.MouseEvent, asset?: AssetItem) => {
@@ -1127,10 +1262,16 @@ export function ContentBrowser({
             )}
 
             {/* Create File Dialog */}
-            {createFileDialog && (
+            {createFileDialog && (() => {
+                // 规范化扩展名（确保有点号前缀）
+                // Normalize extension (ensure dot prefix)
+                const ext = createFileDialog.template.extension.startsWith('.')
+                    ? createFileDialog.template.extension
+                    : `.${createFileDialog.template.extension}`;
+                return (
                 <PromptDialog
-                    title={`New ${createFileDialog.template.label}`}
-                    message={`Enter file name (.${createFileDialog.template.extension} will be added):`}
+                    title={locale === 'zh' ? `新建 ${getTemplateLabel(createFileDialog.template.label)}` : `New ${createFileDialog.template.label}`}
+                    message={locale === 'zh' ? `输入文件名（将添加 ${ext}）:` : `Enter file name (${ext} will be added):`}
                     placeholder="filename"
                     confirmText={locale === 'zh' ? '创建' : 'Create'}
                     cancelText={locale === 'zh' ? '取消' : 'Cancel'}
@@ -1139,8 +1280,8 @@ export function ContentBrowser({
                         setCreateFileDialog(null);
 
                         let fileName = value;
-                        if (!fileName.endsWith(`.${template.extension}`)) {
-                            fileName = `${fileName}.${template.extension}`;
+                        if (!fileName.endsWith(ext)) {
+                            fileName = `${fileName}${ext}`;
                         }
                         const filePath = `${parentPath}/${fileName}`;
 
@@ -1156,7 +1297,8 @@ export function ContentBrowser({
                     }}
                     onCancel={() => setCreateFileDialog(null)}
                 />
-            )}
+                );
+            })()}
         </div>
     );
 }

packages/editor-app/src/plugins/builtin/EditorAppearancePlugin.tsx

@@ -56,6 +56,32 @@ class EditorAppearanceEditorModule implements IEditorModuleLoader {
                             step: 1
                         }
                     ]
+                },
+                {
+                    id: 'scriptEditor',
+                    title: '脚本编辑器',
+                    description: '配置用于打开脚本文件的外部编辑器',
+                    settings: [
+                        {
+                            key: 'editor.scriptEditor',
+                            label: '脚本编辑器',
+                            type: 'select',
+                            defaultValue: 'system',
+                            description: '双击脚本文件时使用的编辑器',
+                            options: SettingsService.SCRIPT_EDITORS.map(editor => ({
+                                value: editor.id,
+                                label: editor.name
+                            }))
+                        },
+                        {
+                            key: 'editor.customScriptEditorCommand',
+                            label: '自定义编辑器命令',
+                            type: 'string',
+                            defaultValue: '',
+                            description: '当选择"自定义"时，填写编辑器的命令行命令（如 notepad++）',
+                            placeholder: '例如：notepad++'
+                        }
+                    ]
                 }
             ]
         });

packages/editor-app/src/services/SettingsService.ts

@@ -87,4 +87,64 @@ export class SettingsService {
     public clearRecentProjects(): void {
         this.set('recentProjects', []);
     }
+
+    // ==================== Script Editor Settings ====================
+
+    /**
+     * 支持的脚本编辑器类型
+     * Supported script editor types
+     */
+    public static readonly SCRIPT_EDITORS = [
+        { id: 'system', name: 'System Default', nameZh: '系统默认', command: '' },
+        { id: 'vscode', name: 'Visual Studio Code', nameZh: 'Visual Studio Code', command: 'code' },
+        { id: 'cursor', name: 'Cursor', nameZh: 'Cursor', command: 'cursor' },
+        { id: 'webstorm', name: 'WebStorm', nameZh: 'WebStorm', command: 'webstorm' },
+        { id: 'sublime', name: 'Sublime Text', nameZh: 'Sublime Text', command: 'subl' },
+        { id: 'custom', name: 'Custom', nameZh: '自定义', command: '' }
+    ];
+
+    /**
+     * 获取脚本编辑器设置
+     * Get script editor setting
+     */
+    public getScriptEditor(): string {
+        return this.get<string>('editor.scriptEditor', 'system');
+    }
+
+    /**
+     * 设置脚本编辑器
+     * Set script editor
+     */
+    public setScriptEditor(editorId: string): void {
+        this.set('editor.scriptEditor', editorId);
+    }
+
+    /**
+     * 获取自定义脚本编辑器命令
+     * Get custom script editor command
+     */
+    public getCustomScriptEditorCommand(): string {
+        return this.get<string>('editor.customScriptEditorCommand', '');
+    }
+
+    /**
+     * 设置自定义脚本编辑器命令
+     * Set custom script editor command
+     */
+    public setCustomScriptEditorCommand(command: string): void {
+        this.set('editor.customScriptEditorCommand', command);
+    }
+
+    /**
+     * 获取当前脚本编辑器的命令
+     * Get current script editor command
+     */
+    public getScriptEditorCommand(): string {
+        const editorId = this.getScriptEditor();
+        if (editorId === 'custom') {
+            return this.getCustomScriptEditorCommand();
+        }
+        const editor = SettingsService.SCRIPT_EDITORS.find(e => e.id === editorId);
+        return editor?.command || '';
+    }
 }