@playcraft/build 0.0.3 → 0.0.4

package/dist/base-builder.d.ts

@@ -1,6 +1,8 @@
 export interface BaseBuildOptions {
     outputDir: string;
     selectedScenes?: string[];
+    analyze?: boolean;
+    analyzeReportPath?: string;
 }
 export interface BaseBuildOutput {
     outputDir: string;

package/dist/base-builder.js

@@ -2,6 +2,7 @@ import fs from 'fs/promises';
 import path from 'path';
 import { fileURLToPath } from 'url';
 import { build as viteBuild } from 'vite';
+import { visualizer } from 'rollup-plugin-visualizer';
 import { viteSourceBuilderPlugin } from './vite/plugin-source-builder.js';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
@@ -304,6 +305,11 @@ export class BaseBuilder {
                         entryFileNames: '__[name].js',
                         chunkFileNames: '__[name]-[hash].js',
                         assetFileNames: 'files/assets/[name].[ext]',
+                        format: 'iife', // 使用 IIFE 格式，避免 ES 模块的 import 语句
+                        globals: {
+                            'playcanvas': 'pc',
+                            'pc': 'pc',
+                        },
                     },
                     // 外部化 PlayCanvas Engine（不打包）
                     external: ['pc', 'playcanvas'],
@@ -318,6 +324,19 @@ export class BaseBuilder {
                     outputDir: this.options.outputDir,
                     selectedScenes: this.options.selectedScenes,
                 }),
+                // 打包分析报告（如果启用）
+                ...(this.options.analyze ? [
+                    visualizer({
+                        filename: this.options.analyzeReportPath
+                            ? path.join(this.options.outputDir, this.options.analyzeReportPath)
+                            : path.join(this.options.outputDir, 'base-bundle-report.html'),
+                        template: 'treemap',
+                        gzipSize: true,
+                        brotliSize: true,
+                        open: false,
+                        sourcemap: false,
+                    }),
+                ] : []),
             ],
         };
         // 2. 执行 Vite 构建

package/dist/vite/config-builder.js

@@ -6,7 +6,6 @@ import viteImagemin from '@vheemstra/vite-plugin-imagemin';
 import imageminMozjpeg from 'imagemin-mozjpeg';
 import imageminPngquant from 'imagemin-pngquant';
 import imageminWebp from 'imagemin-webp';
-import { visualizer } from 'rollup-plugin-visualizer';
 import { PLATFORM_CONFIGS } from './platform-configs.js';
 import { vitePlayCanvasPlugin } from './plugin-playcanvas.js';
 import { vitePlatformPlugin } from './plugin-platform.js';
@@ -163,19 +162,6 @@ export class ViteConfigBuilder {
                 removeViteModuleLoader: true,
             }));
         }
-        // 6. 打包分析报告
-        if (this.options.analyze) {
-            const reportPath = this.options.analyzeReportPath
-                ? this.options.analyzeReportPath
-                : path.join(outputDir, 'bundle-report.html');
-            plugins.push(visualizer({
-                filename: reportPath,
-                template: 'treemap',
-                gzipSize: true,
-                brotliSize: true,
-                open: false,
-            }));
-        }
         return plugins.filter(Boolean);
     }
     getPlayableOptions(config) {

package/dist/vite/platform-configs.js

@@ -24,7 +24,7 @@ export const PLATFORM_CONFIGS = {
         playable: {
             patchXhrOut: true,
             inlineGameScripts: true,
-            compressEngine: true,
+            compressEngine: false, // 关闭引擎压缩，便于调试
             configJsonInline: true,
         },
     },

package/dist/vite/plugin-playcanvas.js

@@ -23,17 +23,21 @@ export function vitePlayCanvasPlugin(options) {
             if (options.outputFormat === 'html') {
                 // 1. 内联 PlayCanvas Engine + 引擎补丁
                 html = await inlineEngineScript(html, options.baseBuildDir, options);
-                // 2. 内联并转换 __settings__.js（传递插件上下文）
+                // 2. 内联 __game-scripts.js（用户脚本）
+                if (options.inlineGameScripts) {
+                    html = await inlineGameScripts(html, options.baseBuildDir);
+                }
+                // 3. 内联并转换 __settings__.js（传递插件上下文）
                 html = await inlineAndConvertSettings(html, options.baseBuildDir, options, pluginContext);
-                // 3. 内联 __modules__.js
+                // 4. 内联 __modules__.js
                 html = await inlineModulesScript(html, options.baseBuildDir);
-                // 4. 内联 __start__.js
+                // 5. 内联 __start__.js
                 html = await inlineStartScript(html, options.baseBuildDir, options);
-                // 5. 内联 __loading__.js
+                // 6. 内联 __loading__.js
                 html = await inlineLoadingScript(html, options.baseBuildDir);
-                // 6. 内联 CSS
+                // 7. 内联 CSS
                 html = await inlineCSS(html, options.baseBuildDir, options);
-                // 7. 处理 manifest.json
+                // 8. 处理 manifest.json
                 html = await inlineManifest(html, options.baseBuildDir, options);
             }
             return html;
@@ -375,6 +379,8 @@ async function inlineModulesScript(html, baseBuildDir) {
 }
 /**
  * 内联 __game-scripts.js
+ * 注意：脚本需要在 pc.AppBase 创建后执行，所以插入到 </body> 之前
+ * 同时包装成一个函数，在 DOMContentLoaded 后执行，确保 PlayCanvas 引擎已完全初始化
  */
 async function inlineGameScripts(html, baseBuildDir) {
     const gameScriptsPath = path.join(baseBuildDir, '__game-scripts.js');
@@ -386,13 +392,36 @@ async function inlineGameScripts(html, baseBuildDir) {
         return html;
     }
     const gameScriptsCode = await fs.readFile(gameScriptsPath, 'utf-8');
-    // 在 </head> 之前或第一个 <script> 标签之后插入游戏脚本
-    if (html.includes('</head>')) {
-        html = html.replace('</head>', `<script>${gameScriptsCode}</script>\n</head>`);
+    // 将脚本包装，确保在 pc.script 初始化后执行
+    // pc.createScript 需要 pc.script._scripts 已初始化
+    const wrappedCode = `
+<script>
+(function() {
+  // 等待 pc.script 准备好
+  function initGameScripts() {
+    if (typeof pc === 'undefined' || !pc.script) {
+      setTimeout(initGameScripts, 10);
+      return;
+    }
+    ${gameScriptsCode}
+  }
+  // 延迟执行，确保引擎初始化完成
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initGameScripts);
+  } else {
+    setTimeout(initGameScripts, 0);
+  }
+})();
+</script>`;
+    // 在 </body> 之前插入，确保在其他脚本之后执行
+    if (html.includes('</body>')) {
+        html = html.replace('</body>', `${wrappedCode}\n</body>`);
+    }
+    else if (html.includes('</html>')) {
+        html = html.replace('</html>', `${wrappedCode}\n</html>`);
     }
     else {
-        // 如果没有 </head>，在第一个 <body> 标签之后插入
-        html = html.replace('<body>', `<body>\n<script>${gameScriptsCode}</script>\n`);
+        html += wrappedCode;
     }
     return html;
 }
@@ -513,16 +542,44 @@ async function injectPhysicsLibrary(html, options) {
     if (!library) {
         return html;
     }
-    const filename = library === 'p2' ? 'p2.min.js' : 'cannon.min.js';
-    const code = await readPatchFile(filename);
-    if (!code) {
+    let scriptsToInject = [];
+    if (library === 'p2') {
+        // Inject p2.js (2D physics)
+        const p2Code = await readPatchFile('p2.min.js');
+        if (p2Code) {
+            scriptsToInject.push(`<script>${p2Code}</script>`);
+        }
+    }
+    else if (library === 'cannon') {
+        // Inject Cannon.js (3D physics) + adapter
+        // Get __dirname equivalent in ES modules
+        const __filename = fileURLToPath(import.meta.url);
+        const __dirname = path.dirname(__filename);
+        const physicsDir = path.join(__dirname, '../../physics');
+        try {
+            // 1. Cannon.js engine
+            const cannonPath = path.join(physicsDir, 'cannon-es-bundle.js');
+            const cannonCode = await fs.readFile(cannonPath, 'utf-8');
+            scriptsToInject.push(`<script>${cannonCode}</script>`);
+            // 2. Rigidbody adapter (compatibility layer)
+            const adapterPath = path.join(physicsDir, 'cannon-rigidbody-adapter.js');
+            const adapterCode = await fs.readFile(adapterPath, 'utf-8');
+            scriptsToInject.push(`<script>${adapterCode}</script>`);
+            console.log('[PlayCanvas Plugin] Injected Cannon.js physics engine with rigidbody adapter');
+        }
+        catch (error) {
+            console.warn('[PlayCanvas Plugin] Failed to load Cannon.js files:', error);
+            return html;
+        }
+    }
+    if (scriptsToInject.length === 0) {
         return html;
     }
-    const tag = `<script>${code}</script>`;
+    const injectedScripts = scriptsToInject.join('\n');
     if (html.includes('</head>')) {
-        return html.replace('</head>', `${tag}\n</head>`);
+        return html.replace('</head>', `${injectedScripts}\n</head>`);
     }
-    return `${tag}\n${html}`;
+    return `${injectedScripts}\n${html}`;
 }
 function isAmmoModule(module) {
     const moduleName = module.moduleName?.toLowerCase() ?? '';
@@ -541,6 +598,7 @@ async function inlineConfigAssetUrls(configJson, baseBuildDir, pluginContext) {
     const assets = configJson.assets;
     const skippedAssets = [];
     const optimizedAssets = [];
+    const skippedScripts = [];
     const SIZE_LIMIT = 1 * 1024 * 1024; // 1MB - 跳过超过这个大小的文件
     for (const [assetId, asset] of Object.entries(assets)) {
         const file = asset?.file;
@@ -553,6 +611,13 @@ async function inlineConfigAssetUrls(configJson, baseBuildDir, pluginContext) {
         }
         const cleanUrl = url.split('?')[0];
         const fileName = cleanUrl.toLowerCase();
+        // 跳过指向 __game-scripts.js 的脚本资源
+        // 这些资源已经被打包到 __game-scripts.js 中，不需要单独内联
+        // __game-scripts.js 会通过 transformIndexHtml 钩子内联到 HTML 中
+        if (cleanUrl === '__game-scripts.js' || asset.type === 'script') {
+            skippedScripts.push(asset.name || assetId);
+            continue;
+        }
         // 跳过物理引擎缓存文件和大型文本文件
         if (fileName.endsWith('.pma.txt') ||
             fileName.includes('browsermetrics') ||
@@ -627,6 +692,16 @@ async function inlineConfigAssetUrls(configJson, baseBuildDir, pluginContext) {
             console.log(`  ... 还有 ${skippedAssets.length - 10} 个文件`);
         }
     }
+    if (skippedScripts.length > 0) {
+        console.log(`\n📦 跳过了 ${skippedScripts.length} 个脚本资源（已打包到 __game-scripts.js）`);
+        if (skippedScripts.length <= 10) {
+            skippedScripts.forEach(name => console.log(`  - ${name}`));
+        }
+        else {
+            skippedScripts.slice(0, 5).forEach(name => console.log(`  - ${name}`));
+            console.log(`  ... 还有 ${skippedScripts.length - 5} 个脚本`);
+        }
+    }
     return configJson;
 }
 async function inlineLogoInStartScript(startCode, baseBuildDir) {
@@ -830,11 +905,9 @@ async function buildCompressedEngineScript(engineCode) {
     const base64 = Buffer.from(compressed).toString('base64');
     // 遵循 PlayCanvas 官方 one-page.js 的实现方式
     // 参考: https://github.com/playcanvas/playcanvas-rest-api-tools/blob/main/one-page.js
-    // 1. 使用 new Buffer(base64, "base64") 解码 base64
-    // 2. 使用 Buffer.from(lz4.decompress(e)).toString() 解压并转字符串
-    // 3. 使用 innerText 设置脚本内容
-    // 4. 插入到当前脚本之前（保持执行顺序）
-    const wrapper = `!function(){var e=new Buffer("${base64}","base64"),n=Buffer.from(lz4.decompress(e)).toString(),r=document.createElement("script");r.async=!1,r.innerText=n,document.currentScript.parentNode.insertBefore(r,document.currentScript)}();`;
+    // 官方使用 new Buffer() 因为 lz4.js 提供了 Buffer polyfill
+    // 使用 textContent 而不是 innerText 以避免浏览器对内容的处理
+    const wrapper = `!function(){var e=new Buffer("${base64}","base64"),n=Buffer.from(lz4.decompress(e)).toString(),r=document.createElement("script");r.async=!1,r.textContent=n,document.currentScript.parentNode.insertBefore(r,document.currentScript)}();`;
     return `<script>${wrapper}</script>`;
 }
 async function loadLz4Module() {

package/dist/vite/plugin-source-builder.js

@@ -95,7 +95,11 @@ export function viteSourceBuilderPlugin(options) {
             await fs.writeFile(path.join(options.outputDir, 'config.json'), JSON.stringify(config, null, 2), 'utf-8');
             console.log('[SourceBuilder] 生成 config.json');
             // 生成 __settings__.js
-            const settings = generateSettings(projectConfig);
+            // 如果 config.scenes 中有场景，使用第一个场景的 URL
+            const firstScenePath = config.scenes && config.scenes.length > 0
+                ? config.scenes[0].url
+                : undefined;
+            const settings = generateSettings(projectConfig, firstScenePath);
             await fs.writeFile(path.join(options.outputDir, '__settings__.js'), settings, 'utf-8');
             console.log('[SourceBuilder] 生成 __settings__.js');
             // 复制模板文件
@@ -104,8 +108,8 @@ export function viteSourceBuilderPlugin(options) {
             // 复制资源文件
             await copyAssets(projectConfig, options.projectDir, options.outputDir, config.assets);
             console.log('[SourceBuilder] 复制资源文件');
-            // 生成场景文件
-            await generateSceneFiles(projectConfig, options.projectDir, options.outputDir);
+            // 生成场景文件（只生成 config 中包含的场景）
+            await generateSceneFiles(projectConfig, options.projectDir, options.outputDir, config.scenes);
             console.log('[SourceBuilder] 生成场景文件');
         },
     };
@@ -275,12 +279,18 @@ async function copyAssets(projectConfig, projectDir, outputDir, assetsOverride)
     const assets = assetsOverride || (projectConfig.format === 'playcanvas'
         ? projectConfig.assets
         : projectConfig.assets);
+    // 使用 Set 去重，避免重复复制同一个文件
+    const copiedUrls = new Set();
     // 遍历 assets
     for (const [assetId, asset] of Object.entries(assets)) {
         const assetData = asset;
         if (!assetData.file?.url || assetData.file.url.startsWith('data:')) {
             continue;
         }
+        // 跳过已经复制过的 URL
+        if (copiedUrls.has(assetData.file.url)) {
+            continue;
+        }
         const sourcePath = path.join(projectDir, assetData.file.url);
         const targetPath = path.join(outputDir, assetData.file.url);
         try {
@@ -291,6 +301,8 @@ async function copyAssets(projectConfig, projectDir, outputDir, assetsOverride)
             await fs.mkdir(targetDir, { recursive: true });
             // 复制文件
             await fs.copyFile(sourcePath, targetPath);
+            // 标记为已复制
+            copiedUrls.add(assetData.file.url);
         }
         catch (error) {
             // 资源文件可能不存在（可能是内联的）
@@ -301,14 +313,23 @@ async function copyAssets(projectConfig, projectDir, outputDir, assetsOverride)
 /**
  * 生成场景文件
  */
-async function generateSceneFiles(projectConfig, projectDir, outputDir) {
+async function generateSceneFiles(projectConfig, projectDir, outputDir, selectedScenes) {
     if (projectConfig.format === 'playcanvas') {
         const pcProject = projectConfig;
         // PlayCanvas 格式：scenes.json 中已包含场景数据
         if (pcProject.scenes) {
-            const scenes = Array.isArray(pcProject.scenes)
+            let scenes = Array.isArray(pcProject.scenes)
                 ? pcProject.scenes
                 : Object.entries(pcProject.scenes).map(([id, scene]) => ({ id, ...scene }));
+            // 如果提供了 selectedScenes，只生成这些场景
+            if (selectedScenes && selectedScenes.length > 0) {
+                const selectedUrls = new Set(selectedScenes.map(s => s.url));
+                scenes = scenes.filter((scene) => {
+                    const sceneId = scene.id || scene.name || 'scene';
+                    const sceneUrl = `${sceneId}.json`;
+                    return selectedUrls.has(sceneUrl);
+                });
+            }
             for (const scene of scenes) {
                 const sceneData = scene;
                 const sceneId = sceneData.id || sceneData.name || 'scene';
@@ -321,7 +342,16 @@ async function generateSceneFiles(projectConfig, projectDir, outputDir) {
     else {
         // PlayCraft 格式：从 scenes/ 目录读取
         const pcProject = projectConfig;
-        for (const scene of pcProject.scenes) {
+        let scenes = pcProject.scenes;
+        // 如果提供了 selectedScenes，只生成这些场景
+        if (selectedScenes && selectedScenes.length > 0) {
+            const selectedNames = new Set(selectedScenes.map(s => s.name));
+            scenes = scenes.filter((scene) => {
+                const sceneName = scene.name || scene.id || 'scene';
+                return selectedNames.has(sceneName);
+            });
+        }
+        for (const scene of scenes) {
             const sceneData = scene;
             const sceneId = sceneData.id || sceneData.name || 'scene';
             const scenePath = path.join(outputDir, `${sceneId}.json`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@playcraft/build",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "private": false,
   "type": "module",
   "main": "./dist/index.js",

package/templates/patches/one-page-inline-game-scripts.js

@@ -1,5 +1,13 @@
 (function () {
   pc.ScriptHandler.prototype._loadScript = function (url, callback) {
+    // 如果 URL 不是 data URL（如 __game-scripts.js），则跳过加载
+    // 因为脚本已经在 HTML 中作为 <script> 标签执行过了
+    if (!url.startsWith('data:')) {
+      // 直接调用回调，不创建新的脚本元素
+      callback(null, url, null);
+      return;
+    }
+
     var head = document.head;
     var element = document.createElement('script');
     this._cache[url] = element;