快速上手

本篇文档详细介绍如何使用 GM Web SDK 来开发和集成前端应用。GM Web SDK 为前端开发者提供了丰富的 API 接口，支持文件操作、终端交互、系统集成等核心功能，让您的应用能够深度融入 GM 生态系统。

适用场景

GM Web SDK 适用于需要与 GM 平台深度集成的 Web 应用，包括但不限于：

打开文件系统
打开终端
打开代码编辑器
上传文件

快速开始

安装与引入

方式一：通过 `<script>` 标签引入

您可以通过以下两种方式在 HTML 页面中引入 GM SDK：

选项 A：CDN 引入（推荐用于快速测试）

<script src="https://down-gmb.oss-cn-zhangjiakou.aliyuncs.com/appWebJs/gmAppSdk.js"></script>

选项 B：本地引入（推荐用于生产环境）

本地部署建议

为了确保生产环境的稳定性和加载速度，建议将 SDK 文件下载到本地项目中使用。

下载 SDK 文件到您的项目目录：

# 下载到项目的 js 目录
curl -o js/gmAppSdk.js https://down-gmb.oss-cn-zhangjiakou.aliyuncs.com/appWebJs/gmAppSdk.js

在 HTML 中引入本地文件：

<script src="./js/gmAppSdk.js"></script>

使用 SDK

引入后，GM SDK 将挂载在全局变量 window.$gm 上，您可以通过以下方式访问 SDK 提供的全部 API：

// 检查 SDK 是否加载成功
if (window.$gm) {
    console.log('GM SDK 加载成功');
    
    // 调用 SDK 方法
    window.$gm.methodName();
} else {
    console.error('GM SDK 加载失败');
}

方式二：npm 安装

安装依赖

使用 npm 或 yarn 安装 gm-app-sdk：

npm install gm-app-sdk
# 或者
yarn add gm-app-sdk

引入 SDK

在项目中引入 gm-app-sdk：

import gmAppSdk from 'gm-app-sdk';

接入 SDK

重要提示：为避免出现未知错误，请务必在入口文件的首行引入 gm-app-sdk。

// main.js - 在文件首行引入
import 'gm-app-sdk';
import { createApp } from 'vue';
import App from './App.vue';

const app = createApp(App);
app.mount('#app');

TypeScript 支持

如果您的项目使用 TypeScript，可以添加类型定义以获得更好的开发体验：

步骤 1：创建类型声明文件

在项目根目录创建或编辑 global.d.ts 文件：

// global.d.ts - 扩展全局 Window 接口
import { GMProps } from 'gm-app-sdk';

declare global {
    interface Window {
        $gm: GMProps;
    }
}

export {};

步骤 2：配置 TypeScript

确保在 tsconfig.json 中包含类型声明文件：

{
  "compilerOptions": {
    "types": ["gm-app-sdk"]
  },
  "include": [
    "src/**/*",
    "global.d.ts"
  ]
}

使用示例

完成上述配置后，您可以在项目中使用 SDK 提供的功能：

// 在 Vue 组件中使用
export default {
  mounted() {
    // 访问 GM SDK 功能
    if (window.$gm) {
      console.log('GM SDK 已成功加载');
      // 使用 SDK 提供的方法
      window.$gm.someMethod();
    }
  }
}

注意事项

加载顺序：必须在应用程序的最早阶段引入 SDK
兼容性：确保您的构建工具支持 ES6 模块导入
类型安全：使用 TypeScript 时建议配置类型声明以获得更好的开发体验