Getting Started

This document provides detailed instructions on how to use the GM Web SDK to develop and integrate frontend applications. The GM Web SDK provides rich API interfaces for frontend developers, supporting core features like file operations, terminal interaction, and system integration, allowing your application to deeply integrate into the GM ecosystem.

Applicable Scenarios

GM Web SDK is suitable for Web applications that need deep integration with the GM platform, including but not limited to:

• Open file system
• Open terminal
• Open code editor
• Upload files

Quick Start

Installation and Import

Method 1: Import via <script> tag

You can import the GM SDK in HTML pages in the following two ways:

Option A: CDN Import (Recommended for quick testing)

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

Option B: Local Import (Recommended for production)

Local Deployment Suggestion

To ensure production environment stability and loading speed, it's recommended to download the SDK file to your local project.

1. Download the SDK file to your project directory:

   # Download to project's js directory
   curl -o js/gmAppSdk.js https://down-gmb.oss-cn-zhangjiakou.aliyuncs.com/appWebJs/gmAppSdk.js

2. Import the local file in HTML:

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

Using the SDK

After import, the GM SDK will be mounted on the global variable window.$gm. You can access all APIs provided by the SDK as follows:

// Check if SDK loaded successfully
if (window.$gm) {
    console.log('GM SDK loaded successfully');
    
    // Call SDK method
    window.$gm.methodName();
} else {
    console.error('GM SDK failed to load');
}

Method 2: npm Installation

Install Dependencies

Install gm-app-sdk using npm or yarn:

npm install gm-app-sdk
# or
yarn add gm-app-sdk

Import SDK

Import gm-app-sdk in your project:

import gmAppSdk from 'gm-app-sdk';

Integrate SDK

Important Note: To avoid unknown errors, be sure to import gm-app-sdk on the first line of the entry file.

// main.js - Import on the first line
import 'gm-app-sdk';
import { createApp } from 'vue';
import App from './App.vue';

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

TypeScript Support

If your project uses TypeScript, you can add type definitions for a better development experience:

Step 1: Create Type Declaration File

Create or edit the global.d.ts file in the project root:

// global.d.ts - Extend global Window interface
import { GMProps } from 'gm-app-sdk';

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

export {};

Step 2: Configure TypeScript

Ensure the type declaration file is included in tsconfig.json:

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

Usage Example

After completing the above configuration, you can use SDK features in your project:

// Using in Vue component
export default {
  mounted() {
    // Access GM SDK features
    if (window.$gm) {
      console.log('GM SDK loaded successfully');
      // Use SDK methods
      window.$gm.someMethod();
    }
  }
}

Notes

• Loading Order: Must import SDK at the earliest stage of the application
• Compatibility: Ensure your build tool supports ES6 module imports
• Type Safety: When using TypeScript, it's recommended to configure type declarations for a better development experience