extensions-api -- expose public apis to extension via "module-alias" package

Signed-off-by: Roman <ixrock@gmail.com>

package.json

@@ -11,7 +11,7 @@
     "email": "info@k8slens.dev"
   },
   "scripts": {
-    "dev": "concurrently -k \"yarn dev-run -C\" \"yarn dev:main\" \"yarn dev:renderer\"",
+    "dev": "concurrently -k \"yarn dev-run -C\" yarn:dev:*",
     "dev-run": "nodemon --watch static/build/main.js --exec \"electron --inspect .\"",
     "dev:main": "yarn compile:main --watch",
     "dev:renderer": "yarn compile:renderer --watch",
@@ -168,6 +168,7 @@
     "@types/lodash": "^4.14.155",
     "@types/marked": "^0.7.4",
     "@types/mock-fs": "^4.10.0",
+    "@types/module-alias": "^2.0.0",
     "@types/node": "^12.12.45",
     "@types/proper-lockfile": "^4.1.1",
     "@types/tar": "^4.0.3",
@@ -192,6 +193,7 @@
     "mobx": "^5.15.5",
     "mobx-observable-history": "^1.0.3",
     "mock-fs": "^4.12.0",
+    "module-alias": "^2.2.2",
     "node-machine-id": "^1.1.12",
     "node-pty": "^0.9.0",
     "openid-client": "^3.15.2",

src/common/vars.ts

@@ -2,6 +2,7 @@
 import path from "path";
 import packageInfo from "../../package.json"
 import { defineGlobal } from "./utils/defineGlobal";
+import { addAlias } from "module-alias";
 
 export const isMac = process.platform === "darwin"
 export const isWindows = process.platform === "win32"
@@ -11,7 +12,6 @@ export const isDevelopment = isDebugging || !isProduction;
 export const isTestEnv = !!process.env.JEST_WORKER_ID;
 
 export const appName = `${packageInfo.productName}${isDevelopment ? "Dev" : ""}`
-export const extensionApiLibName = `${appName}-extensions.api`
 export const publicPath = "/build/"
 
 // Webpack build paths
@@ -19,10 +19,16 @@ export const contextDir = process.cwd();
 export const buildDir = path.join(contextDir, "static", publicPath);
 export const mainDir = path.join(contextDir, "src/main");
 export const rendererDir = path.join(contextDir, "src/renderer");
-export const extensionsDir = path.join(contextDir, "src/extensions");
 export const htmlTemplate = path.resolve(rendererDir, "template.html");
 export const sassCommonVars = path.resolve(rendererDir, "components/vars.scss");
 
+// Extensions
+export const extensionsLibName = `${appName}-extensions.api`
+export const extensionsDir = path.join(contextDir, "src/extensions");
+
+// Special dynamic module aliases
+addAlias("@lens/extensions", path.resolve(buildDir, `${extensionsLibName}.js`)); // fixme: provide path in prod
+
 // Special runtime paths
 defineGlobal("__static", {
   get() {

src/extensions/example-extension/example-extension.ts

@@ -1,4 +1,3 @@
-// fixme: provide runtime import / webpack.resolve.alias / require.extensions (?)
 import { LensExtension } from "@lens/extensions";
 
 export default class ExampleExtension extends LensExtension {

src/extensions/example-extension/tsconfig.json

@@ -11,7 +11,9 @@
     "allowJs": true,
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
-    "resolveJsonModule": true
+    "resolveJsonModule": true,
+    "skipLibCheck": true,
+    "declaration": true
   },
   "include": [
     "../extension-api.mock.d.ts",

src/extensions/extension-api.mock.d.ts

@@ -1,5 +1,3 @@
-// todo: auto-generate from ./extension-api.ts
-// todo: remove when npm-available (with generated types)
 
 declare module "@lens/extensions" {
   export = LensExtensions

src/extensions/extension-api.ts

@@ -1,4 +1,4 @@
-// LensExtensions.api.js developer kit (Lens common components)
+// Lens-extensions.api.js developer kit
-// Should be published to npm (with types declarations) and also available as built-in dependency
+// todo: generate types instead of extension-api.mock.d.ts
 
 export * from "./extension"

src/extensions/extension.ts

@@ -4,14 +4,6 @@ import { action, observable, when } from "mobx";
 import extensionManifest from "./example-extension/package.json"
 import logger from "../main/logger";
 
-// TODO: extensions api
-// * figure out how to expose/inject lens apis to extension:
-// -- replace import "@lens" to real path to "build/Lens.js" or maybe "build/Lens-extensions.api.js"
-// -- load extension via NodeJS.require() / webContents.executeJavaScript()
-// * figure out how to re-use/provide-access from extension to its:
-// -- npm dependencies
-// -- folder assets/resources
-
 export type ExtensionId = string;
 export type ExtensionVersion = string | number;
 export type ExtensionManifest = typeof extensionManifest & ExtensionModel;
@@ -49,7 +41,8 @@ export class LensExtension implements ExtensionModel {
   }
 
   async init() {
-    // todo
+    // todo: add more app/extension lifecycle hooks? e.g. onAppExit(), etc.
+    // todo: provide runtime dependencies
   }
 
   async install() {

webpack.renderer.ts

@@ -1,4 +1,4 @@
-import { extensionApiLibName, appName, buildDir, extensionsDir, htmlTemplate, isDevelopment, isProduction, publicPath, rendererDir, sassCommonVars } from "./src/common/vars";
+import { appName, buildDir, extensionsLibName, extensionsDir, htmlTemplate, isDevelopment, isProduction, publicPath, rendererDir, sassCommonVars } from "./src/common/vars";
 import path from "path";
 import webpack from "webpack";
 import HtmlWebpackPlugin from "html-webpack-plugin";
@@ -16,7 +16,7 @@ export default function (): webpack.Configuration {
     cache: isDevelopment,
     entry: {
       [appName]: path.resolve(rendererDir, "bootstrap.tsx"),
-      [extensionApiLibName]: path.resolve(extensionsDir, "extension-api.ts"), // todo: use separated tsconfig.json?
+      [extensionsLibName]: path.resolve(extensionsDir, "extension-api.ts"),
     },
     output: {
       publicPath: publicPath,
@@ -152,7 +152,7 @@ export default function (): webpack.Configuration {
         filename: `${appName}.html`,
         template: htmlTemplate,
         inject: true,
-        excludeChunks: [extensionApiLibName],
+        excludeChunks: [extensionsLibName],
       }),
 
       new MiniCssExtractPlugin({

yarn.lock

@@ -1924,6 +1924,11 @@
   dependencies:
     "@types/node" "*"
 
+"@types/module-alias@^2.0.0":
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/@types/module-alias/-/module-alias-2.0.0.tgz#882668f8b8cdbda44812c3b592c590909e18849e"
+  integrity sha512-e3sW4oEH0qS1QxSfX7PT6xIi5qk/YSMsrB9Lq8EtkhQBZB+bKyfkP+jpLJRySanvBhAQPSv2PEBe81M8Iy/7yg==
+
 "@types/node@*":
   version "14.0.11"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-14.0.11.tgz#61d4886e2424da73b7b25547f59fdcb534c165a3"
@@ -8020,6 +8025,11 @@ mock-fs@^4.12.0:
   resolved "https://registry.yarnpkg.com/mock-fs/-/mock-fs-4.12.0.tgz#a5d50b12d2d75e5bec9dac3b67ffe3c41d31ade4"
   integrity sha512-/P/HtrlvBxY4o/PzXY9cCNBrdylDNxg7gnrv2sMNxj+UJ2m8jSpl0/A6fuJeNAWr99ZvGWH8XCbE0vmnM5KupQ==
 
+module-alias@^2.2.2:
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/module-alias/-/module-alias-2.2.2.tgz#151cdcecc24e25739ff0aa6e51e1c5716974c0e0"
+  integrity sha512-A/78XjoX2EmNvppVWEhM2oGk3x4lLxnkEA4jTbaK97QKSDjkIoOsKQlfylt/d3kKKi596Qy3NP5XrXJ6fZIC9Q==
+
 moment@^2.10.2, moment@^2.26.0:
   version "2.26.0"
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.26.0.tgz#5e1f82c6bafca6e83e808b30c8705eed0dcbd39a"