neo-cmp-cli 1.5.6 → 1.6.0-beta.1

package/README.md

@@ -21,72 +21,82 @@ neo-cmp-cli 是 Neo 自定义组件开发工具，基于 [AKFun](https://github.
 
 ## 快速开始
 
-### 方法一：全局安装自定义组件开发工具
-##### 1) 全局安装
+#### 1) 全局安装自定义组件开发工具
 ```bash
 yarn global add neo-cmp-cli
 # 或
 npm i -g neo-cmp-cli
 ```
-##### 2) 创建自定义组件（默认 React+TS，可用 -t 指定模板，-n 指定自定义组件名称）
-```bash
-neo init -t=react-ts
-```
-##### 3) 进入自定义组件项目根目录，安装依赖并运行
+
+#### 2) 创建自定义组件项目
 ```bash
-# 创建自定义组件项目
+# 方式一：创建空的自定义组件项目
 neo createProject
 
-# 也可以根据模板创建自定义组件项目
+# 方式二：根据模板创建自定义组件项目（默认 React+TS，可用 -t 指定模板，-n 指定自定义组件名称）
 neo init
+```
+
+#### 3) 进入自定义组件项目根目录，安装依赖并运行
+```bash
+cd xxCmpProject
+```
 
+#### 4) 创建自定义组件
+```bash
 # 在当前项目中创建一个自定义组件
 neo createCmp
+```
+默认在当前项目 src/components/ 目录下新增自定义组件。
 
+#### 5) 本地预览自定义组件内容
+```bash
 # 预览自定义组件内容
 neo preview
-
-# 外链调试（在平台线上预览与调试）
-neo linkDebug
-
-# 构建并发布到 NeoCRM（需自行添加授权配置，并确保 package.json 的 name 唯一、version 不重复）
-neo pushCmp
 ```
+执行成功后，默认自动打开本地浏览器预览自定义组件内容。
 
-### 方法二：在现有业务项目中使用自定义组件开发工具
-此方式可用于将现有业务组件发布成平台可用自定义组件。
-
-##### 1) 安装到当前项目，并添加开发依赖
-使用以下安装命令时会自动将 neo-cmp-cli 添加成当前项目开发依赖
+#### 6) 外链调试（在 NeoCRM 端预览与调试）
 ```bash
-yarn add neo-cmp-cli --dev
-# 或
-npm i neo-cmp-cli --save-dev
-```
-##### 2) 在 package.json 添加可用执行脚本
-```bash
-"preview": "neo preview",
-"linkDebug": "neo linkDebug",
-"pushCmp": "neo pushCmp"
+neo linkDebug
 ```
-##### 3) 初始化配置文件
+需在NeoCRM / 页面设计器端启动 debug 模式，并添加控制台输出的外链脚本地址，方可在页面设计器端使用当前自定义组件。
+
+#### 7) 构建并发布到 NeoCRM
 ```bash
-neo config init
+neo pushCmp
 ```
-##### 4) 开发调试和发布
-```bash
-npm run preview
-npm run linkDebug
-npm run pushCmp
+##### 需自行添加授权配置，并确保 package.json 的 name 唯一、version 不重复。
+```javascript
+module.exports = {
+  neoConfig: {
+    neoBaseURL: 'https://crm-cd.xiaoshouyi.com', // 平台根地址（默认：https://crm.xiaoshouyi.com）
+    tokenAPI: 'https://login-cd.xiaoshouyi.com/auc/oauth2/token', // Token 获取接口地址（默认：https://login.xiaoshouyi.com/auc/oauth2/token）
+    // NeoCRM 授权配置
+    auth: {
+      client_id: 'xx', // 客户端 ID，从创建连接器的客户端信息中获取（Client_Id）
+      client_secret: 'xxx', // 客户端秘钥，从创建连接器的客户端信息中获取（Client_Secret）
+      username: 'xx', // 用户在销售易系统中的用户名
+      /**
+       * password 为 用户在销售易系统中的账号密码加上 8 位安全令牌。
+       * 例如，用户密码为 123456，安全令牌为 ABCDEFGH，则 password 的值应为 123456ABCDEFGH。
+       */
+      password: 'xx xx' // 用户账户密码 + 8 位安全令牌
+    },
+  },
+}
 ```
+1、客户端 ID 和 客户端秘钥 需通过 创建连接器 获取，获取方式见：[https://doc.xiaoshouyi.com](https://doc.xiaoshouyi.com) / 创建连接器；
+2、如何获取 安全令牌 见：[https://doc.xiaoshouyi.com](https://doc.xiaoshouyi.com) / OAuth安全认证 / 密码模式 / 获取令牌；
+3、发布成功后即可在 NeoCRM 对应租户环境的页面设计器和表单设计器中使用此自定义组件。
 
 ## 常用命令说明
-- **neo init**: 交互式创建自定义组件（支持 -t、--name）。
-- **neo createProject**: 创建自定义组件项目（支持 --name）。
-- **neo createCmp**: 在当前项目中创建一个自定义组件（支持 --name）。
-- **neo preview**: 本地预览自定义组件内容（支持 --name），默认支持热更新与接口代理。
-- **neo linkDebug**: 外链调试模式，在平台端页面设计器中调试自定义组件。
-- **neo publish2oss**: 构建并上传到对象存储（支持 --name，可自定义配置对象存储）。
+- **neo init**: 交互式创建自定义组件（支持 -t、--name）;
+- **neo createProject**: 创建自定义组件项目（支持 --name）;
+- **neo createCmp**: 在当前项目中创建一个自定义组件（支持 --name）;
+- **neo preview**: 本地预览自定义组件内容（支持 --name），默认支持热更新与接口代理;
+- **neo linkDebug**: 外链调试模式，在平台端页面设计器中调试自定义组件;
+- **neo publish2oss**: 构建并上传到对象存储（支持 --name，可自定义配置对象存储）;
 - **neo pushCmp**: 构建并发布到NeoCRM平台（支持 --name，需自行添加授权配置）。
 
 ## 开发须知
@@ -150,14 +160,13 @@ neo linkDebug
 ##### 需自行添加授权配置
 ```javascript
 module.exports = {
-  pushCmp: {
+  neoConfig: {
     neoBaseURL: 'https://crm-cd.xiaoshouyi.com', // 平台根地址（默认：https://crm.xiaoshouyi.com）
     tokenAPI: 'https://login-cd.xiaoshouyi.com/auc/oauth2/token', // Token 获取接口地址（默认：https://login.xiaoshouyi.com/auc/oauth2/token）
     // NeoCRM 授权配置
-    authConfig: {
+    auth: {
       /**
-       * 客户端 ID 和 客户端秘钥 需通过 创建连接器 获取，
-       * 详细见：https://doc.xiaoshouyi.com / 创建连接器。
+       * 客户端 ID 和 客户端秘钥 需通过 创建连接器 获取
        */
       client_id: 'xx', // 客户端 ID，从创建连接器的客户端信息中获取（Client_Id）
       client_secret: 'xxx', // 客户端秘钥，从创建连接器的客户端信息中获取（Client_Secret）
@@ -165,7 +174,6 @@ module.exports = {
       /**
        * password 为 用户在销售易系统中的账号密码加上 8 位安全令牌。
        * 例如，用户密码为 123456，安全令牌为 ABCDEFGH，则 password 的值应为 123456ABCDEFGH。
-       * 如何获取 安全令牌请见：https://doc.xiaoshouyi.com / OAuth安全认证 / 密码模式 / 获取令牌。
        */
       password: 'xx xx' // 用户账户密码 + 8 位安全令牌
     },
@@ -176,8 +184,12 @@ module.exports = {
 ##### 支持发布指定自定义组件
 执行 `neo pushCmp --name=xxCmp`
 
+##### 线上 NeoCRM 端使用
+发布成功后，即可在对应租户环境下的页面设计器和表单设计器中使用此自定义组件。
+
 #### 7）发布自定义组件至CDN
 执行 `neo publish2oss` 即可构建对应自定义组件，并自动将构建后资源上传到对象存储（OSS）中。  
+备注：请优先使用 neo pushCmp。
 
 ##### 发布前请确保
 - **package.json 的 name 唯一**
@@ -207,6 +219,9 @@ module.exports = {
 ##### 支持发布指定自定义组件
 执行 `neo publish2oss --name=xxCmp`
 
+##### 特别说明
+此发布方式只是将自定义组件构建产物发布到 CDN 上，如要使用自定义组件还需要手动添加到指定租户上（NeoCRM 管理端 / 自定义组件管理页）。
+
 ## 项目工程配置说明（neo.config.js）
 neo-cmp-cli 默认提供完整配置； 
 如需自定义，使用 `neo config init` 生成 `neo.config.js` 并按需修改。

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "neo-cmp-cli",
-  "version": "1.5.6",
+  "version": "1.6.0-beta.1",
   "description": "前端脚手架：自定义组件开发工具，支持react 和 vue2.0技术栈。",
   "keywords": [
     "neo-cli",

package/src/cmpUtils/createCmpByTemplate.js

@@ -29,12 +29,12 @@ module.exports = function (cmpName, componentBaseDir = './src/components') {
   const finalCmpPath = path.resolve(process.cwd(), componentBaseDir, finalCmpName);
 
   if (!hasNeoProject()) {
-    console.error(`${consoleTag}创建自定义组件失败，当前目录（${process.cwd()}）还不是 neo 项目。`);
+    console.error(`${consoleTag}当前（${process.cwd()}）还不是自定义组件项目，请先创建一个自定义组件项目（neo init / neo createProject）。`);
     process.exit(1);
   }
 
   if (hasCmpTypeByDir(finalCmpName)) {
-    console.error(`${consoleTag}创建自定义组件失败，当前已经存在${finalCmpName}自定义组件。`);
+    console.error(`${consoleTag}创建自定义组件失败，当前项目已经存在${finalCmpName}自定义组件。`);
     process.exit(1);
   }
 

package/src/cmpUtils/createCmpByZip.js

@@ -0,0 +1,87 @@
+const fs = require('fs-extra');
+const path = require('path');
+const axios = require('axios');
+const ora = require('ora');
+const AdmZip = require('adm-zip');
+const { consoleTag } = require('../utils/neoParams'); // 输出标记
+const hasCmpTypeByDir = require('./hasCmpTypeByDir');
+const hasNeoProject = require('../projectUtils/hasNeoProject');
+
+/**
+ * 从 zip 包中创建自定义组件
+ * @param {*} cmpZipUrl 自定义组件源码文件地址（zip包地址）
+ * @param {*} cmpName 自定义组件名称
+ * @param {*} componentBaseDir 自定义组件目录
+ */
+module.exports = async function (cmpZipUrl, cmpName, componentBaseDir = './src/components') {
+  const finalCmpName = cmpName || 'neoCustomCmp';
+
+  if (!hasNeoProject()) {
+    console.error(
+      `${consoleTag}当前（${process.cwd()}）还不是自定义组件项目，请先创建一个自定义组件项目（neo init / neo createProject）。`
+    );
+    process.exit(1);
+  }
+
+  if (hasCmpTypeByDir(finalCmpName)) {
+    console.error(`${consoleTag}当前项目已经存在${finalCmpName}自定义组件。`);
+    process.exit(1);
+  }
+
+  // 创建临时目录
+  const tempDir = path.join(process.cwd(), '.neo-cli', 'zip-source');
+
+  // 下载源码文件并解析到 src/components 目录下
+  try {
+    await fs.ensureDir(tempDir); // 如果目录不存在，会自动创建（包括所有必要的父目录）
+
+    // 下载 zip 文件
+    const spinner = ora(`${consoleTag}正在下载组件源码...`).start();
+    const zipFilePath = path.join(tempDir, `${finalCmpName}.zip`);
+
+    const response = await axios({
+      url: cmpZipUrl,
+      method: 'GET',
+      responseType: 'arraybuffer'
+    });
+
+    // 保存 zip 文件到临时目录
+    await fs.writeFile(zipFilePath, response.data);
+
+    // 解压 zip 文件
+    spinner.text(`${consoleTag}正在解压组件源码...`);
+    const zip = new AdmZip(zipFilePath);
+    const extractPath = path.join(tempDir, finalCmpName);
+    zip.extractAllTo(extractPath, true);
+
+    // 查找解压后的 src/components 目录
+    const cmpSourcePath = path.join(extractPath, componentBaseDir, finalCmpName);
+
+    if (!fs.existsSync(cmpSourcePath)) {
+      spinner.stopAndFail(`${consoleTag}解压后的 zip 包中未找到 ${finalCmpName} 组件源码目录。`);
+      await fs.remove(tempDir);
+      process.exit(1);
+    }
+
+    // 确保目标目录存在
+    const targetComponentsDir = path.resolve(process.cwd(), componentBaseDir, finalCmpName);
+    await fs.ensureDir(targetComponentsDir);
+
+    // 复制 src/components 目录下的所有内容到目标目录
+    await fs
+      .copy(cmpSourcePath, targetComponentsDir)
+      .catch((err) => spinner.stopAndFail(`${consoleTag}自定义组件模板下载失败：`, err));
+
+    // 清理临时目录
+    await fs.remove(tempDir);
+    spinner.succeed(`${consoleTag}已成功从 zip 包解析自定义组件（${finalCmpName}）!`);
+
+    return true;
+  } catch (error) {
+    spinner.stopAndFail(`${consoleTag}从 zip 包创建自定义组件失败（${finalCmpName}）：`, error.message);
+    // 清理临时目录
+    await fs.remove(tempDir);
+
+    return false;
+  }
+};

package/src/cmpUtils/pullCmp.js

@@ -0,0 +1,96 @@
+const _ = require('lodash');
+const { catchCurPackageJson } = require('../utils/pathUtils');
+const getConfigObj = require('../utils/getConfigObj');
+const ora = require('ora');
+const NeoService = require('../neo/neoService');
+const { getFramework } = require('../utils/common');
+const getCmpTypeByDir = require('../cmpUtils/getCmpTypeByDir.js');
+const createCmpByZip = require('../cmpUtils/createCmpByZip.js');
+
+// 获取当前项目的package文件
+const currentPackageJsonDir = catchCurPackageJson();
+const currentPackageJson = getConfigObj(currentPackageJsonDir);
+const framework = getFramework(currentPackageJson.framework);
+
+/**
+ * 从 NeoCRM 拉取自定义组件
+ * @param {string} cmpType 自定义组件类型
+ * @param {object} authConfig 授权配置
+ */
+const pullCmp = async (cmpType, authConfig, _neoService) => {
+
+  if (!authConfig) {
+    console.error('未找到 NeoCRM 平台授权配置（neo.config.js / authConfig）。');
+    return;
+  }
+
+  const cmpTypes = getCmpTypeByDir(); // 获取当前项目目录中已存在的自定义组件类型
+  if (cmpTypes.indexOf(cmpType) > -1) {
+    console.error(`当前项目目录中已存在${cmpType}自定义组件。（./src/components 目录下）`);
+    process.exit(1);
+  }
+
+  const spinner = ora('正在拉取组件...').start();
+
+  try {
+    let neoService = _neoService;
+    let cmpList = [], cmpInfoMap = {};
+    let cmpInfo = null;
+
+    if (_neoService) {
+      // 使用传入的 neoService 实例
+      cmpList = _neoService.cmpList || [];
+      cmpInfoMap = _neoService.cmpInfoMap || {};
+    } else {
+      // 创建新的 neoService 实例
+      neoService = new NeoService(authConfig);
+      
+      // 获取自定义组件列表
+      spinner.text('正在获取自定义组件列表...');
+      cmpList = await neoService.getCustomCmpList();
+      cmpInfoMap = neoService.cmpInfoMap || {};
+    }
+
+    if (cmpList.length === 0) {
+      spinner.stopAndFail('拉取失败，当前租户暂无任何自定义组件。');
+      process.exit(1);
+    }
+
+    // 获取自定义组件信息
+    spinner.text(`正在查找 ${cmpType} 组件信息...`);
+    cmpInfo = neoService.getCmpInfoByCmpType(cmpType);
+    if (!cmpInfo) {
+      spinner.stopAndFail(`拉取失败，当前租户不存在${cmpType}自定义组件。`);
+      process.exit(1);
+    }
+
+    // 判断拉取的组件和当前项目是否为同一技术栈
+    if (cmpInfo.framework !== framework) {
+      spinner.stopAndFail(`拉取失败，${cmpType}自定义组件与当前项目技术栈不一致。`);
+      process.exit(1);
+    }
+
+    // 获取当前源码
+    if (!cmpInfo.codeLib) {
+      spinner.stopAndFail(`拉取失败，${cmpType}自定义组件未记录对应的源码文件。`);
+      process.exit(1);
+    }
+
+    // 下载源码文件并解析到 src/components 目录下
+    const codeLib = cmpInfo.codeLib; // 源码文件地址（zip包地址）
+    
+    // 将zip 包里面的自定义组件源码解析到 src/components 目录下
+    const cmpResult = await createCmpByZip(codeLib, cmpType, './src/components');
+    if (!cmpResult) {
+      spinner.stopAndFail(`拉取失败，${cmpType}自定义组件源码解析失败，请检查源码文件是否正确。`);
+      process.exit(1);
+    }
+
+    spinner.succeed(`已成功拉取${cmpType}自定义组件！\n`);
+  } catch (error) {
+    spinner.fail(`拉取自定义组件失败: ${error.message}`);
+    throw error;
+  }
+};
+
+module.exports = pullCmp;

package/src/cmpUtils/pushCmp.js

@@ -5,49 +5,13 @@ const { catchCurPackageJson } = require('../utils/pathUtils');
 const getConfigObj = require('../utils/getConfigObj');
 const ora = require('ora');
 const NeoService = require('../neo/neoService');
-const { consoleTag } = require('../utils/neoParams');
+const { getFramework } = require('../utils/common');
 const createCmpProjectZip = require('../projectUtils/createCmpProjectZip');
 
 // 获取当前项目的package文件
 const currentPackageJsonDir = catchCurPackageJson();
 const currentPackageJson = getConfigObj(currentPackageJsonDir);
 
-/**
- * 获取技术栈标识
- * 目的：兼容用户非标准写法
- * 0: React, 1: vue2, 2: jQuery, 3: vue3
- */
-function getFramework(_framework) {
-  let defaultFramework = '0'; // 默认 React 技术栈
-  if (!_framework) {
-    return defaultFramework;
-  }
-  let curFramework = _framework.toLowerCase().trim();
-  switch (curFramework) {
-    case 'jquery':
-    case 'jq':
-      curFramework = '2';
-      break;
-    case 'vue2':
-    case 'vue 2':
-    case 'vue2.0':
-    case 'vue 2.0':
-      curFramework = '1';
-      break;
-    case 'vue':
-    case 'vue3':
-    case 'vue 3':
-    case 'vue3.0':
-    case 'vue 3.0':
-      curFramework = '3';
-      console.error(`${consoleTag} 暂不支持 vue3.0 技术栈。`);
-      break;
-    default:
-      curFramework = '0';
-  }
-  return curFramework;
-}
-
 /**
  * 构建组件数据映射
  * @param {string} assetsRoot 构建产物的目录
@@ -61,7 +25,7 @@ const buildComponentData = async (assetsRoot, cmpInfo) => {
   }
 
   const { cmpType } = cmpInfo;
-  
+
   if (!assetsRoot || !fs.existsSync(assetsRoot)) {
     console.error(`未找到自定义组件目录: ${assetsRoot}`);
     return null;
@@ -76,7 +40,7 @@ const buildComponentData = async (assetsRoot, cmpInfo) => {
     globalThis.window = {
       console: console,
       neoRequire: () => {},
-      postMessage: () => {},
+      postMessage: () => {}
       // 可以添加其他常用的 window 属性
     };
   }
@@ -88,13 +52,14 @@ const buildComponentData = async (assetsRoot, cmpInfo) => {
       let modelModule = require(modelFile);
       // 获取导出的模型类（可能是 default 导出或命名导出）
       // const CatchCustomCmpModelClass = modelModule.default || modelModule;
-    }
-    else {
+    } else {
       console.error(`未找到自定义组件模型文件，请检查以下路径是否存在：`, modelFile);
       return null;
     }
     if (!window.NEOEditorCustomModels) {
-      console.error(`模型文件未导出有效模型方法（CatchCustomCmpModelClass），模型文件地址： ${modelFile} `);
+      console.error(
+        `模型文件未导出有效模型方法（CatchCustomCmpModelClass），模型文件地址： ${modelFile} `
+      );
       return null;
     }
 
@@ -116,6 +81,7 @@ const buildComponentData = async (assetsRoot, cmpInfo) => {
       ...cmpInfo,
       plugin: cmpInfo.modelAsset,
       version: currentPackageJson.version || '1.0.0',
+      // 技术栈标识: 从 package.json / framework 字段获取，没有则默认 为 react ts 技术栈
       framework: currentPackageJson.framework ? getFramework(currentPackageJson.framework) : '0', // 0: React, 1: vue2, 2: jQuery, 3: vue3
       // 从模型实例中提取并设置组件信息
       label: modelInstance.label || cmpType,
@@ -128,9 +94,11 @@ const buildComponentData = async (assetsRoot, cmpInfo) => {
       events: modelInstance.events || [],
       actions: modelInstance.actions || [],
       // 如果模型实例中有其他属性，也可以添加
-      exposedToDesigner: modelInstance.exposedToDesigner !== undefined ? modelInstance.exposedToDesigner : true,
+      exposedToDesigner:
+        modelInstance.exposedToDesigner !== undefined ? modelInstance.exposedToDesigner : true,
       namespace: modelInstance.namespace || 'neo-cmp-cli',
-      enableDuplicate: modelInstance.enableDuplicate !== undefined ? modelInstance.enableDuplicate : true
+      enableDuplicate:
+        modelInstance.enableDuplicate !== undefined ? modelInstance.enableDuplicate : true
     };
 
     console.log(`自定义组件模型信息（${cmpType}）:`, curCmpInfo);
@@ -152,15 +120,13 @@ const buildComponentData = async (assetsRoot, cmpInfo) => {
 /**
  * 发布组件到 NeoCRM
  * @param {object} config 配置信息
- * @param {string} assetsRoot 构建产物的目录
+ * @param {string} cmpType 自定义组件类型
  */
 const pushCmp = async (config, cmpType) => {
-  const {
-    authConfig: credentials
-  } = config;
+  const { auth: credentials } = config;
 
   if (!credentials) {
-    console.error('未找到 NeoCRM 平台授权配置（neo.config.js / pushCmp / authConfig）。');
+    console.error('未找到 NeoCRM 平台授权配置（neo.config.js / neoConfig）');
     return;
   }
 
@@ -168,33 +134,76 @@ const pushCmp = async (config, cmpType) => {
 
   try {
     // 步骤 1: 初始化 NeoService
-    spinner.text = '发布自定义组件：初始化 NeoService...';
-    const neoService = new NeoService(config);
+    let neoService = new NeoService(config);
 
     // 步骤 2: 打包源码文件（打包单个自定义组件源码）
-    spinner.text = '发布自定义组件：打包源码文件（含单个自定义组件源码）...';
-    createCmpProjectZip(cmpType, process.cwd(), config.assetsRoot);
+    spinner.start(`[1/4] 打包源码文件（含单个自定义组件源码）...`);
+    let zipPath;
+    try {
+      zipPath = createCmpProjectZip(cmpType, process.cwd(), config.assetsRoot);
+      if (!zipPath) {
+        spinner.fail('[1/4] 源码文件打包失败，未返回 zip 文件路径。');
+      } else {
+        spinner.succeed(`[1/4] 源码文件打包完成: ${path.basename(zipPath)}。`);
+      }
+    } catch (error) {
+      spinner.fail(`[1/4] 源码文件打包失败。`);
+    }
 
     // 步骤 3: 上传构建后资源文件
-    spinner.text = '发布自定义组件：上传自定义组件构建产物到 OSS...';
-    const cmpInfo = await neoService.publish2oss(cmpType);
-
-    // 步骤 5: 构建组件数据
-    spinner.text = '发布自定义组件：构建组件数据...';
-    const componentInfo = await buildComponentData(config.assetsRoot, cmpInfo);
-    if (!componentInfo) {
-      throw new Error(`构建组件数据失败，未获取到自定义组件模型信息。（${cmpType}）`);
+    spinner.start(`[2/4] 上传自定义组件构建产物到 OSS...`);
+    let cmpInfo;
+    try {
+      cmpInfo = await neoService.publish2oss(cmpType);
+      if (!cmpInfo || !cmpInfo.cmpType) {
+        spinner.fail('[2/4] 上传构建产物失败，未获取到组件信息。');
+      } else {
+        spinner.succeed(`[2/4] 构建产物上传完成。`);
+      }
+    } catch (error) {
+      spinner.fail(`[2/4] 构建产物上传失败。`);
     }
 
-    // 步骤 6: 保存组件信息
-    spinner.text = '发布自定义组件：保存组件信息...';
-    await neoService.updateCustomComponent(componentInfo);
+    // 步骤 4: 构建组件数据
+    spinner.start(`[3/4] 构建组件数据...`);
+    let componentInfo;
+    try {
+      componentInfo = await buildComponentData(config.assetsRoot, cmpInfo);
+      if (!componentInfo) {
+        spinner.fail(`[3/4] 未获取到自定义组件模型信息（${cmpType}）。`);
+      } else {
+        spinner.succeed(`[3/4] 组件数据构建完成。`);
+      }
+    } catch (error) {
+      spinner.fail(`[3/4] 组件数据构建失败: `, error.message);
+    }
 
-    spinner.succeed('自定义组件发布成功！\n', componentInfo);
+    // 步骤 5: 保存组件信息
+    spinner.start(`[4/4] 保存组件信息到 NeoCRM 平台...`);
+    try {
+      await neoService.updateCustomComponent(componentInfo);
+      spinner.succeed(`[4/4] 组件信息保存成功`);
+    } catch (error) {
+      spinner.fail(`[4/4] 组件信息保存失败`);
+    }
+
+    // 最终成功提示
+    console.log('\n✅ 自定义组件发布成功！');
+    console.log('\n组件信息:', componentInfo);
   } catch (error) {
-    spinner.fail(`自定义组件发布失败: ${error.message}`);
+    // 内层 catch 已经处理了步骤错误并显示了 spinner 失败状态
+    // 这里处理未预期的错误（如果 spinner 还在运行）
+    try {
+      // ora 的 spinner 对象可能没有 isSpinning 属性，使用 try-catch 安全访问
+      if (spinner && spinner.isSpinning) {
+        spinner.fail(`❌ 自定义组件发布失败: ${error.message}`);
+      }
+    } catch {
+      // 如果访问失败或 spinner 已停止，直接输出错误信息
+      console.error(`\n❌ 自定义组件发布失败: ${error.message}`);
+    }
     throw error;
   }
 };
 
-module.exports = pushCmp;
+module.exports = pushCmp;