@ttmg/cli 0.1.5 → 0.1.6

package/dist/index.js

@@ -15,14 +15,17 @@ var os = require('os');
 var child_process = require('child_process');
 var https = require('https');
 var semver = require('semver');
+var axios = require('axios');
 var handlebars = require('handlebars');
 var esbuild = require('esbuild');
 var archiver = require('archiver');
+var expressStaticGzip = require('express-static-gzip');
+var chokidar = require('chokidar');
 var WebSocket = require('ws');
+var ttmgPack = require('ttmg-pack');
 var glob = require('glob');
 var got = require('got');
 var FormData = require('form-data');
-var ttmgPack = require('ttmg-pack');
 
 function _interopNamespaceDefault(e) {
   var n = Object.create(null);
@@ -41,6 +44,8 @@ function _interopNamespaceDefault(e) {
   return Object.freeze(n);
 }
 
+var path__namespace = /*#__PURE__*/_interopNamespaceDefault(path);
+var os__namespace = /*#__PURE__*/_interopNamespaceDefault(os);
 var glob__namespace = /*#__PURE__*/_interopNamespaceDefault(glob);
 
 const CONFIG_FILE_NAME = 'minigame.config.json';
@@ -192,6 +197,7 @@ function init() {
 
 async function openUrl(url) {
     try {
+        const userDataDir = path__namespace.join(os__namespace.homedir(), '.my-chrome-dev-profile');
         await chromeLauncher.launch({
             startingUrl: url,
             chromeFlags: [
@@ -200,11 +206,11 @@ async function openUrl(url) {
                 '--allow-insecure-localhost',
                 '--allow-running-insecure-content',
                 '--remote-allow-origins=*',
-                '--user-data-dir=/tmp/chrome-debug-profile',
-                '--disable-popup-blocking'
+                `--user-data-dir=${userDataDir}`,
             ],
         });
         await new Promise(() => { });
+        return true;
     }
     catch (e) {
         // const open = await import('open');
@@ -291,48 +297,143 @@ To update, run: ${chalk.magenta(`npm i -g ${pkgName}`)}
     }
 }
 
+let config$1 = null;
+const CONFIG_PATH = path.join(os.homedir(), '.ttmgrc');
+const getTTmgrcConfig = () => {
+    if (config$1) {
+        return config$1;
+    }
+    else {
+        // only check one time
+        if (!fs.existsSync(CONFIG_PATH)) {
+            fs.writeFileSync(CONFIG_PATH, '{}');
+            return {};
+        }
+        else {
+            // safe parse
+            let res = JSON.parse(fs.readFileSync(CONFIG_PATH, 'utf8'));
+            config$1 = res;
+            return res;
+        }
+    }
+};
+const setTTmgrcConfig = (config) => {
+    // updata cache config
+    config = config;
+    fs.writeFileSync(CONFIG_PATH, JSON.stringify(config));
+};
+
 /*
  *
  * 基于开发者输入的邮箱账号和密码进行登录，登录成功后存储账号和返回的 cookie 至本地，类似 npm
  */
+const LOGIN_TT4D = 'https://developers.tiktok.com/passport/web/email/login';
+const params = {
+    aid: '2471',
+    account_sdk_source: 'web',
+    sdk_version: '2.1.1',
+};
 const prompt = inquirer.createPromptModule();
-const CONFIG_PATH = path.join(os.homedir(), '.ttmgrc');
 async function login() {
-    // 1. 获取用户输入
+    // 增加对邮箱密码的校验
     const { email, password } = await prompt([
-        { type: 'input', name: 'email', message: '请输入邮箱账号:' },
-        { type: 'password', name: 'password', message: '请输入密码:', mask: '*' },
+        {
+            type: 'input',
+            name: 'email',
+            message: '请输入邮箱账号:',
+            validate: input => {
+                if (!input) {
+                    return 'email is required, please input email';
+                }
+                else {
+                    /**
+                     * 邮箱格式校验
+                     */
+                    if (!/^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/.test(input)) {
+                        return 'email format is invalid';
+                    }
+                }
+                return true;
+            },
+        },
+        {
+            type: 'password',
+            name: 'password',
+            message: '请输入密码:',
+            mask: '*',
+            validate: input => {
+                if (!input) {
+                    return 'password is required, please input password';
+                }
+                return true;
+            },
+        },
     ]);
-    try {
-        // 2. 请求登录接口
-        // const response = await axios.post(
-        //   'https://developers.tiktok.com/passport/web/email/login/?aid=2471&account_sdk_source=web&sdk_version=2.1.6-tiktok&verifyFp=verify_mfavz9g2_ycOtXIar_WIqx_42JG_8SOW_4D6YysTKunpb',
-        //   {
-        //     email,
-        //     password,
-        //   },
-        //   {
-        //     withCredentials: true,
-        //   },
-        // );
-        // // 3. 获取 cookie
-        // const setCookie = response.headers['set-cookie'];
-        // if (!setCookie) {
-        //   console.log('登录失败，未返回 cookie');
-        //   return;
-        // }
-        // 4. 存储账号和 cookie 到本地 ~/.ttmgrc
+    // const email = 'zhanghongyang.mocha@bytedance.com';
+    // const password = 'BOKEboke1314?';
+    const url = LOGIN_TT4D + '?' + new URLSearchParams(params);
+    const headers = { 'Content-Type': 'application/x-www-form-urlencoded' };
+    console.log(chalk.yellow('⏳ Please wait, logging in...'));
+    const response = await axios.post(url, {
+        email,
+        password,
+    }, { headers });
+    if (response?.data?.data?.error_code) {
+        console.error(chalk.red(`❌ login failed: ${response.data?.data?.description || response.data?.data?.error_code}`));
+        process.exit(1);
+    }
+    else {
         const data = {
             email,
-            cookie: '_ttp=2wqKnK3Yb65BuVqLqeeMUjWKD7W; tt_chain_token=vxgO9iPSWB+6xYu3aO3RGw==; d_ticket=1444f6a26052f4919429f0e16689ee67c77af; ttwid=1%7CFeMoDZ8N9sTnKbwZ33DcTGk46ZFgw4IadcCzTxXFEjs%7C1756899035%7C7d27405e2db5ac486eb6ee03cfcf13a9d86625deb672466f9e3c1651c068c487; csrf_session_id=caf26d4c0ecc54e2a25a025c92fb6c4f; s_v_web_id=verify_mfavz9g2_ycOtXIar_WIqx_42JG_8SOW_4D6YysTKunpb; passport_csrf_token=acd3ee68954a195c9137cc816b9fb6d7; passport_csrf_token_default=acd3ee68954a195c9137cc816b9fb6d7; store-country-sign=MEIEDMvOxGLthOIn0j3M3gQg75hoNvqLled8LLm0cCUn4sCyqAWE8B-3Ot1PLYucx1IEEPLYaz6ok73in9EPqjHcGho; sid_guard_tt_open=1b76acc062070251b8917063b59dc729%7C1757321726%7C21600%7CMon%2C+08-Sep-2025+14%3A55%3A26+GMT; uid_tt_tt_open=f12e9238d436936d63198a211362a2ec; uid_tt_ss_tt_open=f12e9238d436936d63198a211362a2ec; sid_tt_tt_open=1b76acc062070251b8917063b59dc729; sessionid_tt_open=1b76acc062070251b8917063b59dc729; sessionid_ss_tt_open=1b76acc062070251b8917063b59dc729; sid_ucp_v1_tt_open=1.0.0-KDJkNmI5ZjkzODA4ZDRiZDBkYzEyMTBiYjg1ZTc3YjAxM2U2ZmFhYTEKCRD-s_rFBhinExADGgZtYWxpdmEiIDFiNzZhY2MwNjIwNzAyNTFiODkxNzA2M2I1OWRjNzI5; ssid_ucp_v1_tt_open=1.0.0-KDJkNmI5ZjkzODA4ZDRiZDBkYzEyMTBiYjg1ZTc3YjAxM2U2ZmFhYTEKCRD-s_rFBhinExADGgZtYWxpdmEiIDFiNzZhY2MwNjIwNzAyNTFiODkxNzA2M2I1OWRjNzI5;****',
+            user_id: response?.data?.data?.user_id,
+            cookie: response?.headers['set-cookie'].join('; '),
         };
-        fs.writeFileSync(CONFIG_PATH, JSON.stringify(data, null, 2));
-        console.log(chalk.green.bold('Login success, your account info has saved in:'), CONFIG_PATH);
+        setTTmgrcConfig(data);
+        console.log(chalk.bold.green('✅ login successfully!'));
         process.exit(0);
     }
+}
+
+/**
+ * 获取配置文件中的 cookie
+ */
+const config = getTTmgrcConfig();
+const cookie = config.cookie;
+axios.defaults.headers.common['Cookie'] = cookie;
+// ppe_dev_tool
+async function request({ url, method, data, headers, params, }) {
+    try {
+        const res = await axios({
+            url,
+            method,
+            data,
+            params,
+            headers,
+        });
+        return {
+            data: res.data,
+            error: null,
+        };
+    }
     catch (err) {
-        console.error(chalk.red('login failed:'), err.response ? err.response.data : err.message);
-        process.exit(1);
+        console.error('request failed', err.response?.data);
+        return {
+            data: null,
+            error: err.response?.data,
+        };
+    }
+}
+
+function getCurrentUser() {
+    try {
+        const config = getTTmgrcConfig();
+        return {
+            email: config?.email || '',
+            user_id: config?.user_id || '',
+        };
+    }
+    catch (err) {
+        return {};
     }
 }
 
@@ -655,15 +756,53 @@ function getOutputDir() {
 
 const DEV_PORT = 9528;
 const DEV_WS_PORT = 9529;
-const OUTPUT_DIR = path.join(os.homedir(), '__TTMG__');
+path.join(os.homedir(), '__TTMG__');
+
+function openDevTool() {
+    try {
+        const qrCodeUrl = `http://localhost:${DEV_PORT}`;
+        console.log('');
+        console.log(chalk.green.bold('💡 Tips for Local Debugging'));
+        console.log(chalk.gray('─────────────────────────────────────────────'));
+        console.log(chalk.yellow.bold('1.') +
+            ' The QR code page will be opened automatically in Chrome.');
+        console.log('   If it fails, please open the following link manually:');
+        console.log('   ' + chalk.cyan.underline('http://localhost:9528'));
+        console.log('');
+        console.log(chalk.yellow.bold('2.') +
+            ' The debugging service will automatically compile your game assets.');
+        console.log('   Any changes in your game directory will trigger recompilation.');
+        console.log('   You can debug the updated content when upload is completed.');
+        console.log('');
+        console.log(chalk.yellow.bold('3.') +
+            ' After scanning the QR code with your phone for Test User authentication,');
+        console.log('   the compiled code package will be uploaded to the client automatically.');
+        console.log('   Game debugging will start right away.');
+        console.log(chalk.gray('─────────────────────────────────────────────'));
+        console.log('');
+        /**
+         * 自动打开浏览器
+         */
+        openUrl(qrCodeUrl);
+    }
+    catch (err) {
+        console.error(chalk.red('Failed to generate QR code image.'), err);
+    }
+}
 
+const successCode = 0;
+const publicPath = path.join(__dirname, 'public');
+// 自定义静态文件服务中间件
 let server;
-async function createServer() {
+async function start() {
     if (server) {
         closeServer();
     }
-    const publicPath = path.join(__dirname, 'public');
     const app = express();
+    app.use(expressStaticGzip(publicPath, {
+        enableBrotli: true,
+        orderPreference: ['br'],
+    }));
     /**
      * 支持跨域请求
      */
@@ -681,20 +820,45 @@ async function createServer() {
      * 支持文件访问
      */
     const outputDir = getOutputDir();
-    /**
-     *
-     */
-    app.use(express.static(publicPath));
     /**
      * 支持静态资源
      */
     app.use('/game/files', express.static(outputDir));
     app.get('/game/config', async (req, res) => {
-        res.send({ nodeWsPort: DEV_WS_PORT });
+        const { clientKey } = getClientKey();
+        const { email, user_id } = getCurrentUser();
+        res.send({
+            email,
+            user_id,
+            code: successCode,
+            nodeWsPort: DEV_WS_PORT,
+            clientKey: clientKey,
+            schema: `https://www.tiktok.com/ttmg/dev/${clientKey}?host=${getLocalIP()}&port=${DEV_WS_PORT}`,
+        });
+    });
+    app.get('/game/info', async (req, res) => {
+        const { clientKey } = getClientKey();
+        const data = await request({
+            url: 'https://developers.tiktok.com/tiktok/v3/devportal/minigame/info',
+            method: 'GET',
+            params: {
+                client_key: 'mg7oas80sthix6xy',
+                version_type: 1,
+            },
+            headers: {
+                'x-tt-env': 'ppe_dev_tool',
+                'x-use-ppe': '1',
+            },
+        });
+        res.send({
+            code: successCode,
+            data,
+        });
     });
     app.get('/game/schema', async (req, res) => {
         const { clientKey } = getClientKey();
         res.send({
+            code: successCode,
             schema: `https://www.tiktok.com/ttmg/dev/${clientKey}?host=${getLocalIP()}&port=${DEV_WS_PORT}`,
             nodeWsPort: DEV_WS_PORT,
             clientKey: clientKey,
@@ -705,7 +869,8 @@ async function createServer() {
     });
     // 启动服务
     server = app.listen(port, () => {
-        console.log(chalk.cyan.bold(`Node devServer is running on port ${port}\n`));
+        console.log(chalk.green.bold(`✅ Local dev server started successfully! \n`));
+        openDevTool();
     });
     return {
         port,
@@ -720,6 +885,81 @@ function closeServer() {
     });
 }
 
+/**
+ * 一个类型安全的、通用的事件发射器类。
+ * 它允许你注册、注销和触发具有严格类型检查的事件。
+ */
+class TypedEventEmitter {
+    constructor() {
+        // 使用 Map 存储事件监听器。
+        // Key 是事件名，Value 是一个 Set，其中包含该事件的所有监听器函数。
+        // 使用 Set 可以自动防止同一个监听器被重复注册。
+        this.listeners = new Map();
+    }
+    /**
+     * 注册一个事件监听器。
+     * @param eventName 要监听的事件名称。
+     * @param listener 事件触发时执行的回调函数。
+     * @returns 返回一个函数，调用该函数即可注销此监听器，方便使用。
+     */
+    on(eventName, listener) {
+        if (!this.listeners.has(eventName)) {
+            this.listeners.set(eventName, new Set());
+        }
+        this.listeners.get(eventName).add(listener);
+        // 返回一个便捷的取消订阅函数
+        return () => this.off(eventName, listener);
+    }
+    /**
+     * 注销一个事件监听器。
+     * @param eventName 要注销的事件名称。
+     * @param listener 之前通过 on() 方法注册的回调函数实例。
+     */
+    off(eventName, listener) {
+        const eventListeners = this.listeners.get(eventName);
+        if (eventListeners) {
+            eventListeners.delete(listener);
+            if (eventListeners.size === 0) {
+                this.listeners.delete(eventName);
+            }
+        }
+    }
+    /**
+     * 触发一个事件，并同步调用所有相关的监听器。
+     * @param eventName 要触发的事件名称。
+     * @param payload 传递给所有监听器的数据。类型必须与事件定义匹配。
+     */
+    emit(eventName, payload) {
+        const eventListeners = this.listeners.get(eventName);
+        if (eventListeners) {
+            // 遍历 Set 并执行每一个监听器
+            eventListeners.forEach(listener => {
+                try {
+                    // 在独立的 try...catch 中调用，防止一个监听器的错误影响其他监听器
+                    listener(payload);
+                }
+                catch (error) {
+                    console.error(`Error in listener for event "${String(eventName)}":`, error);
+                }
+            });
+        }
+    }
+    /**
+     * 注销指定事件的所有监听器。
+     * @param eventName 要清除监听器的事件名称。
+     */
+    removeAllListeners(eventName) {
+        this.listeners.delete(eventName);
+    }
+    /**
+     * 清空所有事件的所有监听器。
+     */
+    clearAll() {
+        this.listeners.clear();
+    }
+}
+const eventEmitter = new TypedEventEmitter();
+
 class Store {
     constructor(initialState) {
         this.listeners = [];
@@ -761,149 +1001,18 @@ const store = Store.getInstance({
     clientWsHost: '',
     clientKey: '',
     packages: {},
+    isUnderCompiling: false,
+    isWaitingForUpload: false,
+    projectInfo: {
+        projectSize: 0,
+        mainPkg: {
+            pkgSize: 0,
+            isMatchSizeLimit: false,
+        },
+        independentPkgs: {},
+    },
 });
 
-async function uploadGame(callback) {
-    const outputDir = getOutputDir();
-    callback({
-        status: 'start',
-        percent: 0,
-    });
-    console.log(chalk.yellow.bold('Start compress game resource'));
-    const zipPath = path.join(os.homedir(), '__TTMG__', 'upload.zip');
-    await zipDirectory(outputDir, zipPath);
-    console.log(chalk.green.bold('Compress game package resource success \n'));
-    await uploadZip(zipPath, callback);
-}
-/**
- * 复制源目录内容到临时目录，然后根据 glob 模式过滤并压缩文件。
- * 原始目录保持不变。
- *
- * @param sourceDir - 要压缩的源文件夹路径。
- * @param outPath - 输出的 zip 文件路径。
- */
-async function zipDirectory(sourceDir, outPath) {
-    // 1. 创建一个唯一的临时目录
-    // fsp 现在是 fs.promises 的别名
-    const tempDir = await fs.promises.mkdtemp(path.join(os.tmpdir(), 'zip-temp-'));
-    try {
-        // 2. 将源目录的所有内容复制到临时目录
-        await fs.promises.cp(sourceDir, tempDir, { recursive: true });
-        // 3. 对临时目录进行压缩
-        const output = fs.createWriteStream(outPath);
-        const archive = archiver('zip', { zlib: { level: 9 } });
-        // 使用 Promise 包装流操作
-        const archivePromise = new Promise((resolve, reject) => {
-            output.on('close', () => {
-                resolve();
-            });
-            archive.on('warning', err => console.warn('Archiver warning:', err));
-            output.on('error', err => reject(err));
-            archive.on('error', err => reject(err));
-        });
-        archive.pipe(output);
-        // 4. 使用 glob 在临时目录中查找文件，并应用过滤规则
-        const files = await glob__namespace.glob('**/*', {
-            cwd: tempDir,
-            nodir: true,
-            ignore: '**/*.js.map', // 过滤规则
-        });
-        // 5. 将过滤后的文件逐个添加到压缩包
-        for (const file of files) {
-            const filePath = path.join(tempDir, file);
-            archive.file(filePath, { name: file });
-        }
-        // 6. 完成压缩
-        await archive.finalize();
-        // 等待文件流关闭
-        await archivePromise;
-    }
-    catch (err) {
-        console.error('压缩过程中发生错误:', err);
-        throw err;
-    }
-    finally {
-        // 7. 无论成功还是失败，都清理临时目录
-        await fs.promises.rm(tempDir, { recursive: true, force: true });
-    }
-}
-async function uploadZip(zipPath, callback) {
-    const form = new FormData();
-    form.append('file', fs.createReadStream(zipPath), {
-        filename: 'upload.zip',
-        contentType: 'application/zip',
-    });
-    // 帮我计算下文件大小，变成 MB 为单位
-    const fileSize = fs.statSync(zipPath).size / 1024 / 1024;
-    console.log(chalk.yellow.bold(`Start upload resource to client, size: ${fileSize.toFixed(2)} MB`));
-    const { clientHttpPort, clientHost } = store.getState();
-    const url = `http://${clientHost}:${clientHttpPort}/game/upload`;
-    try {
-        // 1. 创建请求流
-        const stream = got.stream.post(url, {
-            body: form,
-        });
-        // 2. 监听上传进度 (这个回调是并行的，不影响封装)
-        stream.on('uploadProgress', progress => {
-            const percent = progress.percent;
-            // const transferred = progress.transferred;
-            // const total = progress.total;
-            process.stdout.write(`\r${chalk.cyan('Uploading progress:  ')}${chalk.green((percent * 100).toFixed(0) + '%')}`);
-            callback({
-                status: 'process',
-                percent,
-            });
-        });
-        // 3. 【核心封装】将流的处理过程包装在 Promise 中
-        const response = await new Promise((resolve, reject) => {
-            // 用于拼接响应数据
-            const chunks = [];
-            // 当流传输数据时，收集数据块
-            stream.on('data', chunk => {
-                chunks.push(chunk);
-            });
-            // 当流成功结束时
-            stream.on('end', () => {
-                // 拼接所有数据块，并转换为字符串
-                // const responseBody = Buffer.concat(chunks).toString('utf-8');
-                // stream.response 在流结束后才可用
-                // 将完整的响应对象 resolve 出去
-                callback({
-                    status: 'success',
-                    percent: 1,
-                });
-                resolve({
-                    statusCode: 200,
-                });
-            });
-            // 当流发生错误时
-            stream.on('error', err => {
-                // 将错误 reject 出去，这样外层的 try...catch 就能捕获到
-                reject(err);
-                callback({
-                    status: 'error',
-                    percent: 0,
-                    msg: err.message,
-                });
-            });
-        });
-        // 4. 当 await 完成后，说明流已成功结束，可以安全地执行后续操作
-        process.stdout.write('\n'); // 换行，保持终端整洁
-        console.log(chalk.green.bold('✔ Upload completed successfully!'));
-        return response;
-    }
-    catch (err) {
-        callback({
-            status: 'error',
-            percent: 0,
-            msg: err?.message,
-        });
-        process.stdout.write('\n');
-        console.log('\n');
-        console.error(chalk.red.bold('✖ Upload failed with server error, please scan qrcode to reupload'));
-    }
-}
-
 class WsServer {
     constructor() {
         this.ws = new WebSocket.Server({ port: DEV_WS_PORT });
@@ -928,30 +1037,42 @@ class WsServer {
                     const method = clientMessage.method;
                     switch (method) {
                         case 'startUpload':
-                            this.sendUploadStatus('start');
-                            uploadGame(({ status, percent, msg }) => {
-                                if (status === 'process') {
-                                    this.sendUploadStatus('process', {
-                                        status: 'process',
-                                        progress: percent,
-                                    });
-                                }
-                                else if (status === 'error') {
-                                    this.sendUploadStatus('error', {
-                                        status: 'error',
-                                        errMsg: msg,
-                                        isSuccess: false,
-                                    });
-                                }
-                                else if (status === 'success') {
-                                    this.sendUploadStatus('success', {
-                                        status: 'success',
-                                        packages: store.getState().packages,
-                                        clientKey: getClientKey().clientKey,
-                                        isSuccess: true,
-                                    });
-                                }
-                            });
+                            if (store.getState().isUnderCompiling) {
+                                store.setState({
+                                    isWaitingForUpload: true,
+                                });
+                                this.sendResourceCompile();
+                            }
+                            else {
+                                eventEmitter.emit('compileSuccess', {});
+                            }
+                            // /**
+                            //  * 如果是编译中，需要等待编译好之后再上传，关键如何实现呢？
+                            //  * 1. 编译完成后，需要通知客户端上传
+                            //  * 2. 客户端上传完成后，需要通知服务端上传完成
+                            //  */
+                            // this.sendUploadStatus('start');
+                            // uploadGame(({ status, percent, msg }) => {
+                            //   if (status === 'process') {
+                            //     this.sendUploadStatus('process', {
+                            //       status: 'process',
+                            //       progress: percent,
+                            //     });
+                            //   } else if (status === 'error') {
+                            //     this.sendUploadStatus('error', {
+                            //       status: 'error',
+                            //       errMsg: msg,
+                            //       isSuccess: false,
+                            //     });
+                            //   } else if (status === 'success') {
+                            //     this.sendUploadStatus('success', {
+                            //       status: 'success',
+                            //       packages: store.getState().packages,
+                            //       clientKey: getClientKey().clientKey,
+                            //       isSuccess: true,
+                            //     });
+                            //   }
+                            // });
                             break;
                         case 'closeLocalDebug':
                             console.log('closeLocalDebug');
@@ -1048,6 +1169,11 @@ class WsServer {
             method: 'resourceChange',
         });
     }
+    sendResourceCompile() {
+        this.send({
+            method: 'resourceCompile',
+        });
+    }
     close() {
         this.ws.close();
     }
@@ -1061,7 +1187,7 @@ class WsServer {
 }
 const wsServer = new WsServer();
 
-async function prepareResource(context) {
+async function compile(context) {
     const entryDir = process.cwd();
     const outputDir = getOutputDir();
     const { clientKey, msg } = getClientKey();
@@ -1075,7 +1201,12 @@ async function prepareResource(context) {
     if (!fs.existsSync(outputDir)) {
         fs.mkdirSync(outputDir, { recursive: true });
     }
-    const tip = context?.mode === 'watch' ? chalk.yellow('game resource change, restart to upload') : chalk.yellow.bold('Start compile game for debug');
+    store.setState({
+        isUnderCompiling: true,
+    });
+    const tip = context?.mode === 'watch'
+        ? chalk.yellow('⏳ Local game assets updated. Starting build process...\n')
+        : chalk.yellow.bold('⏳ Start compile game assets for local debugging...\n');
     console.log(tip);
     const { isSuccess, errorMsg, packages } = await ttmgPack.debugPkgs({
         entry: entryDir,
@@ -1094,15 +1225,25 @@ async function prepareResource(context) {
         },
     });
     if (!isSuccess) {
+        store.setState({
+            isUnderCompiling: false,
+        });
         console.log(chalk.redBright('Build game package failed, Please check the error message below:'));
         console.log(chalk.redBright(errorMsg));
         process.exit(1);
     }
     else {
         store.setState({
+            isUnderCompiling: false,
             packages,
         });
-        console.log(chalk.green.bold('Compile game package success \n'));
+        if (store.getState().isWaitingForUpload) {
+            eventEmitter.emit('compileSuccess', {});
+        }
+        console.log(chalk.green.bold('✅ Compile game assets success! \n'));
+        /**
+         * 开始上传客户端
+         */
         return {
             isSuccess,
             errorMsg,
@@ -1112,94 +1253,240 @@ async function prepareResource(context) {
 }
 
 // import { uploadGame } from './uploadGame';
-async function watchChange() {
+async function watch() {
     let debounceTimer = null;
-    fs.watch(process.cwd(), (eventType, filename) => {
+    // 监听当前工作目录，排除 node_modules 和 .git
+    const watcher = chokidar.watch(process.cwd(), {
+        // ignored: /(^|[\/\\])(\.git|node_modules)/, // 忽略 .git 和 node_modules
+        ignoreInitial: true, // 忽略初始添加事件
+        persistent: true,
+        awaitWriteFinish: {
+            stabilityThreshold: 1000,
+        },
+    });
+    // 任意文件变化都触发
+    watcher.on('all', (event, path) => {
         // 清除之前的定时器
         if (debounceTimer)
             clearTimeout(debounceTimer);
         // 重新设置定时器
         debounceTimer = setTimeout(async () => {
-            await prepareResource({
+            await compile({
                 mode: 'watch',
             });
             wsServer.sendResourceChange();
-            // TODO：只做文件预准备，但不主动上传
-            // uploadGame()
-            //   .then((res) => {
-            //     if (res.isSuccess) {
-            //       wsServer.sendUploadStatus('success');
-            //     } else {
-            //       wsServer.sendUploadStatus('error', {
-            //         errMsg: res.errorMsg,
-            //       });
-            //     }
-            //   })
-            //   .catch(() => {
-            //     wsServer.sendUploadStatus('error');
-            //   });
             debounceTimer = null;
-        }, 500); // 500ms内只执行一次
+        }, 3000); // 1秒内只执行一次
+    });
+    watcher.on('error', error => {
+        // console.error(chalk.red('[watch] 监听发生错误:'), error);
     });
 }
 
-// 你的静态服务器运行的端口
-// --- 修改结束 ---
-async function showSchema() {
-    if (!fs.existsSync(OUTPUT_DIR)) {
-        fs.mkdirSync(OUTPUT_DIR, { recursive: true });
+async function uploadGame(callback) {
+    const outputDir = getOutputDir();
+    callback({
+        status: 'start',
+        percent: 0,
+    });
+    console.log(chalk.yellow.bold('Start compress game resource'));
+    const zipPath = path.join(os.homedir(), '__TTMG__', 'upload.zip');
+    await zipDirectory(outputDir, zipPath);
+    console.log(chalk.green.bold('Compress game package resource success \n'));
+    await uploadZip(zipPath, callback);
+}
+/**
+ * 复制源目录内容到临时目录，然后根据 glob 模式过滤并压缩文件。
+ * 原始目录保持不变。
+ *
+ * @param sourceDir - 要压缩的源文件夹路径。
+ * @param outPath - 输出的 zip 文件路径。
+ */
+async function zipDirectory(sourceDir, outPath) {
+    // 1. 创建一个唯一的临时目录
+    // fsp 现在是 fs.promises 的别名
+    const tempDir = await fs.promises.mkdtemp(path.join(os.tmpdir(), 'zip-temp-'));
+    try {
+        // 2. 将源目录的所有内容复制到临时目录
+        await fs.promises.cp(sourceDir, tempDir, { recursive: true });
+        // 3. 对临时目录进行压缩
+        const output = fs.createWriteStream(outPath);
+        const archive = archiver('zip', { zlib: { level: 9 } });
+        // 使用 Promise 包装流操作
+        const archivePromise = new Promise((resolve, reject) => {
+            output.on('close', () => {
+                resolve();
+            });
+            archive.on('warning', err => console.warn('Archiver warning:', err));
+            output.on('error', err => reject(err));
+            archive.on('error', err => reject(err));
+        });
+        archive.pipe(output);
+        // 4. 使用 glob 在临时目录中查找文件，并应用过滤规则
+        const files = await glob__namespace.glob('**/*', {
+            cwd: tempDir,
+            nodir: true,
+            ignore: '**/*.js.map', // 过滤规则
+        });
+        // 5. 将过滤后的文件逐个添加到压缩包
+        for (const file of files) {
+            const filePath = path.join(tempDir, file);
+            archive.file(filePath, { name: file });
+        }
+        // 6. 完成压缩
+        await archive.finalize();
+        // 等待文件流关闭
+        await archivePromise;
     }
-    const { clientKey } = getClientKey();
-    // 2. 定义二维码图片的文件名和完整路径
+    catch (err) {
+        console.error('压缩过程中发生错误:', err);
+        throw err;
+    }
+    finally {
+        // 7. 无论成功还是失败，都清理临时目录
+        await fs.promises.rm(tempDir, { recursive: true, force: true });
+    }
+}
+async function uploadZip(zipPath, callback) {
+    const form = new FormData();
+    form.append('file', fs.createReadStream(zipPath), {
+        filename: 'upload.zip',
+        contentType: 'application/zip',
+    });
+    // 帮我计算下文件大小，变成 MB 为单位
+    const fileSize = fs.statSync(zipPath).size / 1024 / 1024;
+    console.log(chalk.yellow.bold(`Start upload resource to client, size: ${fileSize.toFixed(2)} MB`));
+    const { clientHttpPort, clientHost } = store.getState();
+    const url = `http://${clientHost}:${clientHttpPort}/game/upload`;
     try {
-        const qrCodeUrl = `http://localhost:${DEV_PORT}`;
-        // 5. 打印更新后的提示信息
-        console.log(chalk.green.bold('Tips:'));
-        console.log(`  1. ${chalk.yellow.bold('Open the link below in your browser to see the QR code, then scan it.')}`);
-        console.log(`     ${chalk.cyan.underline(qrCodeUrl)}`);
-        console.log(`  2. ${chalk.yellow.bold('Will auto upload compiled resource to client.')}`);
-        console.log(`  3. ${chalk.yellow.bold('Debug your game in the browser.')}\n`);
-        /**
-         * 自动打开浏览器
-         */
-        openUrl(qrCodeUrl);
+        // 1. 创建请求流
+        const stream = got.stream.post(url, {
+            body: form,
+        });
+        // 2. 监听上传进度 (这个回调是并行的，不影响封装)
+        stream.on('uploadProgress', progress => {
+            const percent = progress.percent;
+            // const transferred = progress.transferred;
+            // const total = progress.total;
+            process.stdout.write(`\r${chalk.cyan('Uploading progress:  ')}${chalk.green((percent * 100).toFixed(0) + '%')}`);
+            callback({
+                status: 'process',
+                percent,
+            });
+        });
+        // 3. 【核心封装】将流的处理过程包装在 Promise 中
+        const response = await new Promise((resolve, reject) => {
+            // 用于拼接响应数据
+            const chunks = [];
+            // 当流传输数据时，收集数据块
+            stream.on('data', chunk => {
+                chunks.push(chunk);
+            });
+            // 当流成功结束时
+            stream.on('end', () => {
+                // 拼接所有数据块，并转换为字符串
+                // const responseBody = Buffer.concat(chunks).toString('utf-8');
+                // stream.response 在流结束后才可用
+                // 将完整的响应对象 resolve 出去
+                callback({
+                    status: 'success',
+                    percent: 1,
+                });
+                resolve({
+                    statusCode: 200,
+                });
+            });
+            // 当流发生错误时
+            stream.on('error', err => {
+                // 将错误 reject 出去，这样外层的 try...catch 就能捕获到
+                reject(err);
+                callback({
+                    status: 'error',
+                    percent: 0,
+                    msg: err.message,
+                });
+            });
+        });
+        // 4. 当 await 完成后，说明流已成功结束，可以安全地执行后续操作
+        process.stdout.write('\n'); // 换行，保持终端整洁
+        console.log(chalk.green.bold('✔ Upload completed successfully!'));
+        return response;
     }
     catch (err) {
-        console.error(chalk.red('Failed to generate QR code image.'), err);
+        callback({
+            status: 'error',
+            percent: 0,
+            msg: err?.message,
+        });
+        process.stdout.write('\n');
+        console.log('\n');
+        console.error(chalk.red.bold('✖ Upload failed with server error, please scan qrcode to reupload'));
     }
 }
 
+function listen() {
+    eventEmitter.on('compileSuccess', () => {
+        wsServer.sendUploadStatus('start');
+        store.setState({
+            isWaitingForUpload: false,
+        });
+        uploadGame(({ status, percent, msg }) => {
+            if (status === 'process') {
+                wsServer.sendUploadStatus('process', {
+                    status: 'process',
+                    progress: percent,
+                });
+            }
+            else if (status === 'error') {
+                wsServer.sendUploadStatus('error', {
+                    status: 'error',
+                    errMsg: msg,
+                    isSuccess: false,
+                });
+            }
+            else if (status === 'success') {
+                wsServer.sendUploadStatus('success', {
+                    status: 'success',
+                    packages: store.getState().packages,
+                    clientKey: getClientKey().clientKey,
+                    isSuccess: true,
+                });
+            }
+        });
+    });
+}
+
 async function dev() {
-    /**
-     * 1. 准备游戏资源
-     */
-    prepareResource();
-    /**
-     * 2. 创建本地调试服务
-     */
-    await createServer();
-    /**
-     * 3. 显示调试二维码信息，扫码启动客户端调试服务
-     */
-    await showSchema();
-    /**
-     * 4. 监听游戏资源变化
-     */
-    await watchChange();
+    await start();
+    compile();
+    watch();
+    listen();
 }
 
-var version = "0.1.5";
+/**
+ * 获取配置文件中的 cookie
+ */
+async function upload() {
+    const res = await request({
+        url: 'https://developers.tiktok.com/tiktok/v3/devportal/minigame/info',
+        method: 'GET',
+        params: {
+            client_key: 'mg7oas80sthix6xy',
+            version_type: 1,
+        },
+        headers: {
+            'x-tt-env': 'ppe_dev_tool',
+            'x-use-ppe': '1',
+        },
+    });
+    console.log('app info', res?.data);
+}
+
+var version = "0.1.6";
 var pkg = {
 	version: version};
 
 const program = new commander.Command();
-(async () => {
-    try {
-        await checkUpdate();
-        // eslint-disable-next-line no-empty
-    }
-    catch (err) { }
-})();
 program
     .name('ttmg')
     .description('TikTok Mini Games Command Line Tool')
@@ -1239,6 +1526,11 @@ program
     }
     else {
         dev();
+        try {
+            checkUpdate();
+            // eslint-disable-next-line no-empty
+        }
+        catch (err) { }
     }
 });
 /**
@@ -1258,10 +1550,10 @@ program
     }
 });
 program
-    .command('login')
-    .description('User Dev Portal Account to Login')
+    .command('upload')
+    .description('Upload Native Mini Game')
     .action(async () => {
-    console.log('will support soon');
+    await upload();
 });
 program.parse(process.argv);
 //# sourceMappingURL=index.js.map