feat(cli): 支持加载公网和本地调试扩展

Author: winjo

packages/alex/src/api/createApp.tsx

@@ -34,7 +34,7 @@ import { EXT_WORKER_HOST, WEBVIEW_ENDPOINT } from '../core/env';
 
 export { SlotLocation, SlotRenderer, BoxPanel, SplitPanel };
 
-const getDefaultAppConfig = (): IAppOpts => ({
+export const getDefaultAppConfig = (): IAppOpts => ({
   modules,
   useCdnIcon: true,
   noExtHost: true,

packages/alex/src/api/exports.ts

@@ -1,7 +1,7 @@
-import { REPORT_NAME, BrowserFSFileType } from '@alipay/alex-core';
+import { REPORT_NAME, BrowserFSFileType, HOME_ROOT, WORKSPACE_ROOT } from '@alipay/alex-core';
 
 export { getDefaultLayoutConfig } from '../core/layout';
 
-export { REPORT_NAME, BrowserFSFileType };
+export { REPORT_NAME, BrowserFSFileType, HOME_ROOT, WORKSPACE_ROOT };
 
 export * from '../core/env';

packages/alex/src/api/register.ts

@@ -1,7 +1,7 @@
 import { LanguagesContribution, GrammarsContribution } from '@ali/ide-monaco';
-import { centerRegistry } from '@alipay/alex-registry';
+import { Registry } from '@alipay/alex-registry';
 
-export { centerRegistry };
+export { Registry };
 
 /**
  * @deprecated please import language by path directly
@@ -10,7 +10,7 @@ export { centerRegistry };
  * use `import "@alipay/alex/languages"` to import all languages
  */
 export const registerLanguage = (contrib: LanguagesContribution) => {
-  centerRegistry.register<LanguagesContribution>('language', contrib);
+  Registry.register<LanguagesContribution>('language', contrib);
 };
 
 /**
@@ -20,5 +20,5 @@ export const registerLanguage = (contrib: LanguagesContribution) => {
  * use `import "@alipay/alex/languages"` to import all languages
  */
 export const registerGrammar = (contrib: GrammarsContribution) => {
-  centerRegistry.register<GrammarsContribution>('grammar', contrib);
+  Registry.register<GrammarsContribution>('grammar', contrib);
 };

packages/cli/package.json

@@ -21,11 +21,13 @@
     "@ali/ide-extension-installer": "^2.0.0",
     "@ali/ide-kaitian-extension": "2.2.0",
     "@alipay/alex-shared": "1.0.0-rc.2",
-    "commander": "^6.2.0",
+    "commander": "^7.2.0",
     "fs-extra": "^9.0.1",
     "lodash.pick": "^4.4.0",
+    "portfinder": "^1.0.28",
     "rxjs": "^6.6.3",
     "semver": "^7.3.2",
+    "send": "^0.17.1",
     "signale": "^1.4.0",
     "tslib": "^2.2.0"
   },
@@ -38,6 +40,7 @@
     "@types/fs-extra": "^9.0.4",
     "@types/lodash.pick": "^4.4.6",
     "@types/semver": "^7.3.4",
+    "@types/send": "^0.14.7",
     "@types/signale": "^1.4.1"
   }
 }

packages/cli/src/commander.ts

@@ -1,5 +1,5 @@
-import program from 'commander';
-import { install, uninstall } from './extension';
+import program, { Option } from 'commander';
+import { install, uninstall, installLocalExtensions } from './extension';
 import { log } from './util/log';
 
 program.version(`alex ${require('../package').version}`).usage('<command> [options]');
@@ -33,11 +33,12 @@ version can be ignored, then will use latest version under current kaitian frame
 extensionProgram
   .command('install <extensions...>')
   .alias('i')
+  .addOption(new Option('-m, --mode [type]', 'extension env mode').choices(['internal', 'public']))
   .description(
     'install single or multiple extension, eg. kaitian.ide-dark-theme, kaitian.ide-dark-theme@2.0.0'
   )
-  .action((extensions: string[]) => {
-    install(extensions).catch((err) => console.error(err));
+  .action((extensions: string[], options) => {
+    install(extensions, options).catch((err) => console.error(err));
   });
 
 extensionProgram
@@ -47,4 +48,12 @@ extensionProgram
     uninstall(extensions).catch((err) => console.error(err));
   });
 
+extensionProgram
+  .command('link <extensionDirs...>')
+  .description('link local extension for dev')
+  .option('-h, --host', 'local extension static file service host, default: `localhost`')
+  .action((extensionDirs, options) => {
+    installLocalExtensions(extensionDirs, options).catch((err) => console.error(err));
+  });
+
 program.parse(process.argv);

packages/cli/src/extension.ts

@@ -1,28 +1,39 @@
 import * as path from 'path';
+import * as os from 'os';
 import { ExtensionInstaller, Extension } from '@ali/ide-extension-installer';
 import * as fse from 'fs-extra';
 import { from, of } from 'rxjs';
-import { mergeMap, filter } from 'rxjs/operators';
+import { mergeMap, filter, map } from 'rxjs/operators';
+import { IExtensionMode } from '@alipay/alex-shared';
 import { EXTENSION_DIR, EXTENSION_METADATA_DIR, EXTENSION_FIELD } from './util/constant';
 import { getExtension } from './extension/scanner';
-import { IExtensionBasicMetadata, IExtensionDesc, IExtensionIdentity } from './extension/type';
+import {
+  IExtensionBasicMetadata,
+  IExtensionDesc,
+  IExtensionIdentity,
+  IExtensionServerOptions,
+} from './extension/type';
 import { log, error } from './util/log';
 import checkFramework from './util/check-framework';
+import { createServer, getHttpUri } from './util/serve-file';
 import { formatExtension } from './util';
 import { createMetadataType } from './extension/metadata-type';
 
 let extensionInstaller: ExtensionInstaller;
 let shouldWriteConfig = false;
 
-export const install = async (extensionId?: string[], options?: { silent: boolean }) => {
+export const install = async (
+  extensionId?: string[],
+  options?: { silent: boolean; mode?: 'public' | 'internal' }
+) => {
   checkFramework();
 
   createInstaller();
 
   let extensions: IExtensionDesc[] = [];
 
   if (extensionId?.length) {
-    extensions = parseExtensionId(extensionId);
+    extensions = parseExtensionId(extensionId, options?.mode);
     shouldWriteConfig = true;
     await Promise.all(extensions.map((ext) => removeExtensionById(ext)));
   } else {
@@ -49,8 +60,12 @@ export const install = async (extensionId?: string[], options?: { silent: boolea
   from(extensions)
     .pipe(
       mergeMap(installExtension, 5), // 限制并发数 5
-      mergeMap((extPath) => (Array.isArray(extPath) ? from(extPath) : of(extPath))),
-      mergeMap(getExtension, 5),
+      mergeMap(([extPath, mode]) =>
+        Array.isArray(extPath)
+          ? from(extPath.map((p) => [p, mode] as const))
+          : of([extPath, mode] as const)
+      ),
+      mergeMap(([extPath, mode]) => getExtension(extPath, mode), 5),
       filter((data) => !!data),
       mergeMap(writeMetadata)
     )
@@ -72,6 +87,53 @@ export const install = async (extensionId?: string[], options?: { silent: boolea
     );
 };
 
+/**
+ * 从本地安装扩展
+ * @param dirs 扩展目录
+ */
+export const installLocalExtensions = async (dirs: string[], options?: IExtensionServerOptions) => {
+  checkFramework();
+
+  if (!dirs.length) {
+    return;
+  }
+
+  const absoluteDirs = dirs.map((dir) => path.resolve(dir));
+
+  log.start('开始安装本地扩展\n');
+  const homedir = os.homedir();
+  absoluteDirs.forEach((dir) => {
+    let readablePath = dir;
+    if (dir.startsWith(homedir)) {
+      readablePath = dir.replace(homedir, '~');
+    }
+    console.log(`  * ${readablePath}`);
+  });
+  console.log();
+
+  const httpUri = await getHttpUri(options);
+
+  from(absoluteDirs)
+    .pipe(
+      mergeMap((localExtPath) => getExtension(localExtPath, 'local', httpUri), 5),
+      filter((data) => !!data),
+      mergeMap(writeMetadata)
+    )
+    .subscribe(
+      (ext) => {
+        log.info(`${formatExtension(ext)} 安装完成`);
+      },
+      (err) => {
+        log.error('本地扩展安装失败，请重试');
+        console.error(err);
+      },
+      () => {
+        log.success('本地扩展安装成功');
+        createServer(absoluteDirs, httpUri);
+      }
+    );
+};
+
 async function createInstaller() {
   const pkgJSON = fse.readJSONSync(path.join(__dirname, '../package.json'));
   extensionInstaller = new ExtensionInstaller({
@@ -141,7 +203,7 @@ function checkExtensionConfig(extensions: Extension[]) {
   }
 }
 
-function parseExtensionId(extensionIds: string[]) {
+function parseExtensionId(extensionIds: string[], mode?: IExtensionMode) {
   const extensions: IExtensionDesc[] = [];
   for (const extId of extensionIds) {
     const reg = /^([a-zA-Z][0-9a-zA-Z_-]*)\.([a-zA-Z][0-9a-zA-Z_-]*)(?:@(\d+\.\d+\.\d+.*))?$/;
@@ -150,17 +212,18 @@ function parseExtensionId(extensionIds: string[]) {
       return error(`${extId} 格式不合法，请输入 publisher.name[@version] 的形式`);
     }
     const [, publisher, name, version] = matched;
-    extensions.push({ publisher, name, version });
+    extensions.push({ publisher, name, version, mode });
   }
   return extensions;
 }
 
 async function installExtension(extension: IExtensionDesc) {
-  return extensionInstaller.install({
+  const extensionPath = await extensionInstaller.install({
     publisher: extension.publisher,
     name: extension.name,
     version: extension.version,
   });
+  return [extensionPath, extension.mode] as const;
 }
 
 async function writeMetadata(metadata: IExtensionBasicMetadata) {

packages/cli/src/extension/scanner.ts

@@ -5,12 +5,15 @@
 import * as path from 'path';
 import * as fse from 'fs-extra';
 import { mergeContributes } from '@ali/ide-kaitian-extension/lib/node/merge-contributes';
+import { Uri } from '@ali/ide-core-common';
 import pick from 'lodash.pick';
 
-import { NLSInfo, IExtensionBasicMetadata } from './type';
+import { NLSInfo, IExtensionBasicMetadata, IExtensionMode } from './type';
 
 export async function getExtension(
-  extensionPath: string
+  extensionPath: string,
+  mode?: IExtensionMode,
+  localUri?: Uri
 ): Promise<IExtensionBasicMetadata | undefined> {
   if (!(await fse.pathExists(extensionPath))) {
     return undefined;
@@ -97,7 +100,15 @@ export async function getExtension(
     packageJSON.contributes
   );
 
-  const { publisher, name } = getExtensionIdByPath(extensionPath, packageJSON.version);
+  // 本地扩展的 publisher 和 name 从 package.json 获取，
+  // 远程扩展的 publisher 和 name 从目录名获取
+  const { publisher, name } =
+    mode === 'local' ? packageJSON : getExtensionIdByPath(extensionPath, packageJSON.version);
+
+  let uri: string | undefined;
+  if (mode === 'local' && localUri) {
+    uri = localUri.with({ path: path.join(localUri.path, extensionPath) }).toString();
+  }
 
   const metadata: IExtensionBasicMetadata = {
     extension: {
@@ -115,6 +126,8 @@ export async function getExtension(
     pkgNlsJSON,
     nlsList,
     extendConfig,
+    mode,
+    uri,
   };
   return metadata;
 }

packages/cli/src/extension/type.ts

@@ -7,8 +7,13 @@ export {
   IExtensionDesc,
   JSONType,
   IExtensionMetadata,
+  IExtensionMode,
 } from '@alipay/alex-shared';
 
 export interface IExtensionContributions extends JSONType {}
 
 export interface IKaitianExtensionContributions extends JSONType {}
+
+export interface IExtensionServerOptions {
+  host?: string;
+}

packages/cli/src/util/serve-file.ts

@@ -0,0 +1,54 @@
+import http from 'http';
+import url from 'url';
+import portfinder from 'portfinder';
+import send from 'send';
+import { Uri } from '@ali/ide-core-common';
+import { log } from './log';
+import { IExtensionServerOptions } from '../extension/type';
+
+export const getHttpUri: (options?: IExtensionServerOptions) => Promise<Uri> = async (options) => {
+  const port = await findPort();
+
+  return Uri.from({
+    scheme: 'http',
+    authority: `${options?.host || 'localhost'}:${port}`,
+    path: '/assets',
+    query: '',
+    fragment: '',
+  });
+};
+
+export const createServer = async (dirs: string[], uri: Uri) => {
+  const server = http.createServer((req, res) => {
+    const pathname = decodeURIComponent(url.parse(req.url!).pathname!);
+    const targetDir = dirs.find((dir) => pathname.startsWith(`${uri.path}${dir}`));
+    if (!targetDir) {
+      res.statusCode = 404;
+      res.end();
+      return;
+    }
+    const filepath = pathname.slice(`${uri.path}${targetDir}`.length);
+    send(req, filepath, {
+      cacheControl: false,
+      root: targetDir,
+    })
+      .on('headers', (res: http.ServerResponse) => {
+        res.setHeader('Access-Control-Allow-Origin', '*');
+      })
+      .pipe(res);
+  });
+
+  server.listen(Number(uri.authority.split(':')[1]), () => {
+    log.info(`Local Extension Server: ${uri.scheme}://${uri.authority}`);
+  });
+};
+
+const BASE_PORT = 30000;
+async function findPort() {
+  try {
+    const port = await portfinder.getPortPromise({ port: BASE_PORT });
+    return port;
+  } catch (err) {
+    throw err;
+  }
+}