hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

allow to customize both main & renderer

Browse Source 
Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>
This commit is contained in:
Jari Kolehmainen 2022-12-12 16:02:46 +02:00
parent fa66e356bf
commit 9c75cded69
15 changed files with 307 additions and 192 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
build/generate-tray-icons.ts
View File

@ -10,9 +10,9 @@ import sharp from "sharp";
const size = Number(process.env.OUTPUT_SIZE || "16");
const outputFolder = process.env.OUTPUT_DIR || "./static/build/tray";
const inputFile = process.env.INPUT_SVG_PATH || "./src/renderer/components/icon/logo-lens.svg";
const noticeFile = process.env.NOTICE_SVG_PATH || "./src/renderer/components/icon/notice.svg";
const spinnerFile = process.env.SPINNER_SVG_PATH || "./src/renderer/components/icon/arrow-spinner.svg";
const inputFile = process.env.INPUT_SVG_PATH || path.resolve(__dirname, "../src/renderer/components/icon/logo-lens.svg");
const noticeFile = process.env.NOTICE_SVG_PATH || path.resolve(__dirname, "../src/renderer/components/icon/notice.svg");
const spinnerFile = process.env.SPINNER_SVG_PATH || path.resolve(__dirname, "../src/renderer/components/icon/arrow-spinner.svg");
async function ensureOutputFoler() {
await ensureDir(outputFolder);

21
package.json
View File

@ -6,13 +6,26 @@
"version": "6.3.0-alpha.0",
"main": "static/build/main.js",
"exports": {
".": "./static/build/library/library.js"
"./main": "./static/build/library/main.js",
"./renderer": "./static/build/library/renderer.js",
"./styles": "./static/build/library/renderer.css"
},
"typesVersions": {
"*": {
"main": [
"./src/library.ts"
],
"renderer": [
"./src/renderer/library.ts"
]
}
},
"files": [
"static/**/*",
"!static/build/main.*",
"build/**/*",
"templates/**/*"
"static/build/library/**/*",
"src/**/*",
"webpack/*",
"types/*"
],
"copyright": "© 2022 OpenLens Authors",
"license": "MIT",

8
src/library.ts
View File

@ -4,23 +4,20 @@
*/
import type { DiContainer } from "@ogre-tools/injectable";
import staticFilesDirectoryInjectable from "./common/vars/static-files-directory.injectable";
import { registerInjectables } from "./main/register-injectables";
import { afterApplicationIsLoadedInjectionToken } from "./main/start-main-application/runnable-tokens/after-application-is-loaded-injection-token";
import { beforeApplicationIsLoadingInjectionToken } from "./main/start-main-application/runnable-tokens/before-application-is-loading-injection-token";
import { beforeElectronIsReadyInjectionToken } from "./main/start-main-application/runnable-tokens/before-electron-is-ready-injection-token";
import { onLoadOfApplicationInjectionToken } from "./main/start-main-application/runnable-tokens/on-load-of-application-injection-token";
import startMainApplicationInjectable from "./main/start-main-application/start-main-application.injectable";
import * as extensionApi from "./main/extension-api";
interface AppConfig {
di: DiContainer;
staticPath: string;
}
function startApp(conf: AppConfig) {
const { di, staticPath } = conf;
di.override(staticFilesDirectoryInjectable, () => staticPath);
const { di } = conf;
return di.inject(startMainApplicationInjectable);
}
@ -28,6 +25,7 @@ function startApp(conf: AppConfig) {
export {
registerInjectables,
startApp,
extensionApi,
afterApplicationIsLoadedInjectionToken,
beforeApplicationIsLoadingInjectionToken,
beforeElectronIsReadyInjectionToken,

26
src/main/extension-api.ts Normal file
View File

@ -0,0 +1,26 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import * as Mobx from "mobx";
import { spawn } from "node-pty";
import * as LensExtensionsCommonApi from "../extensions/common-api";
import * as LensExtensionsMainApi from "../extensions/main-api";
/**
* Exports for virtual package "@k8slens/extensions" for main-process.
* All exporting names available in global runtime scope:
* e.g. global.Mobx, global.LensExtensions
*/
const LensExtensions = {
Common: LensExtensionsCommonApi,
Main: LensExtensionsMainApi,
};
const Pty = {
spawn,
};
export { Mobx, LensExtensions, Pty };

19
src/main/index.ts
View File

@ -5,29 +5,12 @@
// Main process
import * as Mobx from "mobx";
import { spawn } from "node-pty";
import * as LensExtensionsCommonApi from "../extensions/common-api";
import * as LensExtensionsMainApi from "../extensions/main-api";
import { getDi } from "./getDi";
import startMainApplicationInjectable from "./start-main-application/start-main-application.injectable";
import { Mobx, LensExtensions, Pty } from "./extension-api";
const di = getDi();
void di.inject(startMainApplicationInjectable);
/**
* Exports for virtual package "@k8slens/extensions" for main-process.
* All exporting names available in global runtime scope:
* e.g. global.Mobx, global.LensExtensions
*/
const LensExtensions = {
Common: LensExtensionsCommonApi,
Main: LensExtensionsMainApi,
};
const Pty = {
spawn,
};
export { Mobx, LensExtensions, Pty };

42
src/renderer/bootstrap.tsx
View File

@ -3,16 +3,8 @@
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import "./components/app.scss";
import React from "react";
import ReactDOM, { render, unmountComponentAtNode } from "react-dom";
import * as Mobx from "mobx";
import * as MobxReact from "mobx-react";
import * as ReactRouter from "react-router";
import * as ReactRouterDom from "react-router-dom";
import * as LensExtensionsCommonApi from "../extensions/common-api";
import * as LensExtensionsRendererApi from "../extensions/renderer-api";
import { render, unmountComponentAtNode } from "react-dom";
import { delay } from "../common/utils";
import { isMac, isDevelopment } from "../common/vars";
import { DefaultProps } from "./mui-base-theme";
@ -21,7 +13,6 @@ import * as initializers from "./initializers";
import logger from "../common/logger";
import { WeblinkStore } from "../common/weblink-store";
import { registerCustomThemes } from "./components/monaco-editor";
import { getDi } from "./getDi";
import { DiContextProvider } from "@ogre-tools/injectable-react";
import type { DiContainer } from "@ogre-tools/injectable";
import extensionLoaderInjectable from "../extensions/extension-loader/extension-loader.injectable";
@ -46,9 +37,6 @@ import assert from "assert";
import startFrameInjectable from "./start-frame/start-frame.injectable";
import initializeSentryReportingWithInjectable from "../common/error-reporting/initialize-sentry-reporting.injectable";
configurePackages(); // global packages
registerCustomThemes(); // monaco editor themes
/**
* If this is a development build, wait a second to attach
* Chrome Debugger to renderer process
@ -61,6 +49,9 @@ async function attachChromeDebugger() {
}
export async function bootstrap(di: DiContainer) {
configurePackages(); // global packages
registerCustomThemes(); // monaco editor themes
const initializeSentryReportingWith = di.inject(initializeSentryReportingWithInjectable);
if (process.isMainFrame) {
@ -171,28 +162,3 @@ export async function bootstrap(di: DiContainer) {
rootElem,
);
}
const di = getDi();
// run
bootstrap(di);
/**
* Exports for virtual package "@k8slens/extensions" for renderer-process.
* All exporting names available in global runtime scope:
* e.g. Devtools -> Console -> window.LensExtensions (renderer)
*/
const LensExtensions = {
Common: LensExtensionsCommonApi,
Renderer: LensExtensionsRendererApi,
};
export {
React,
ReactDOM,
ReactRouter,
ReactRouterDom,
Mobx,
MobxReact,
LensExtensions,
};

33
src/renderer/extension-api.ts Normal file
View File

@ -0,0 +1,33 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import React from "react";
import ReactDOM from "react-dom";
import * as Mobx from "mobx";
import * as MobxReact from "mobx-react";
import * as ReactRouter from "react-router";
import * as ReactRouterDom from "react-router-dom";
import * as LensExtensionsCommonApi from "../extensions/common-api";
import * as LensExtensionsRendererApi from "../extensions/renderer-api";
/**
* Exports for virtual package "@k8slens/extensions" for renderer-process.
* All exporting names available in global runtime scope:
* e.g. Devtools -> Console -> window.LensExtensions (renderer)
*/
const LensExtensions = {
Common: LensExtensionsCommonApi,
Renderer: LensExtensionsRendererApi,
};
export {
React,
ReactDOM,
ReactRouter,
ReactRouterDom,
Mobx,
MobxReact,
LensExtensions,
};

23
src/renderer/getDi.tsx
View File

@ -4,29 +4,10 @@
*/
import { createContainer } from "@ogre-tools/injectable";
import { autoRegister } from "@ogre-tools/injectable-extension-for-auto-registration";
import { registerMobX } from "@ogre-tools/injectable-extension-for-mobx";
import { runInAction } from "mobx";
import { Environments, setLegacyGlobalDiForExtensionApi } from "../extensions/as-legacy-globals-for-extension-api/legacy-global-di-for-extension-api";
import { registerInjectables } from "./register-injectables";
export const getDi = () => {
const di = createContainer("renderer");
setLegacyGlobalDiForExtensionApi(di, Environments.renderer);
runInAction(() => {
registerMobX(di);
autoRegister({
di,
requireContexts: [
require.context("./", true, CONTEXT_MATCHER_FOR_NON_FEATURES),
require.context("../common", true, CONTEXT_MATCHER_FOR_NON_FEATURES),
require.context("../extensions", true, CONTEXT_MATCHER_FOR_NON_FEATURES),
require.context("../features", true, CONTEXT_MATCHER_FOR_FEATURES),
],
});
});
return di;
return registerInjectables(di);
};

28
src/renderer/index.ts Normal file
View File

@ -0,0 +1,28 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import "./components/app.scss";
import { getDi } from "./getDi";
import { bootstrap } from "./bootstrap";
import {
React, ReactDOM, ReactRouter,
ReactRouterDom, Mobx, MobxReact, LensExtensions,
} from "./extension-api";
const di = getDi();
// run
bootstrap(di);
export {
React,
ReactDOM,
ReactRouter,
ReactRouterDom,
Mobx,
MobxReact,
LensExtensions,
};

15
src/renderer/library.ts Normal file
View File

@ -0,0 +1,15 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import "./components/app.scss";
import { bootstrap } from "./bootstrap";
import * as extensionApi from "./extension-api";
import { registerInjectables } from "./register-injectables";
export {
bootstrap,
extensionApi,
registerInjectables,
};

30
src/renderer/register-injectables.ts Normal file
View File

@ -0,0 +1,30 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import type { DiContainer } from "@ogre-tools/injectable";
import { autoRegister } from "@ogre-tools/injectable-extension-for-auto-registration";
import { registerMobX } from "@ogre-tools/injectable-extension-for-mobx";
import { runInAction } from "mobx";
import { Environments, setLegacyGlobalDiForExtensionApi } from "../extensions/as-legacy-globals-for-extension-api/legacy-global-di-for-extension-api";
export function registerInjectables(di: DiContainer) {
setLegacyGlobalDiForExtensionApi(di, Environments.renderer);
runInAction(() => {
registerMobX(di);
autoRegister({
di,
requireContexts: [
require.context("./", true, CONTEXT_MATCHER_FOR_NON_FEATURES),
require.context("../common", true, CONTEXT_MATCHER_FOR_NON_FEATURES),
require.context("../extensions", true, CONTEXT_MATCHER_FOR_NON_FEATURES),
require.context("../features", true, CONTEXT_MATCHER_FOR_FEATURES),
],
});
});
return di;
}

64
webpack/library-bundle.ts Normal file
View File

@ -0,0 +1,64 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import MiniCssExtractPlugin from "mini-css-extract-plugin";
import nodeExternals from "webpack-node-externals";
import { platform } from "os";
import path from "path";
import { DefinePlugin, optimize } from "webpack";
import { main, renderer } from "./library";
import { buildDir } from "./vars";
const config = [
{
...main,
entry: {
main: path.resolve(__dirname, "..", "src", "library.ts"),
},
output: {
libraryTarget: "commonjs",
path: path.resolve(buildDir, "library"),
},
optimization: {
minimize: false,
},
plugins: [
new DefinePlugin({
CONTEXT_MATCHER_FOR_NON_FEATURES: `/\\.injectable(\\.${platform})?\\.tsx?$/`,
CONTEXT_MATCHER_FOR_FEATURES: `/\\/(main|common)\\/.+\\.injectable(\\.${platform})?\\.tsx?$/`,
}),
],
},
{
...renderer,
entry: {
renderer: path.resolve(__dirname, "..", "src", "renderer", "library.ts"),
},
output: {
libraryTarget: "commonjs",
path: path.resolve(buildDir, "library"),
},
optimization: {
minimize: false,
},
externals: [
nodeExternals(),
],
plugins: [
new DefinePlugin({
CONTEXT_MATCHER_FOR_NON_FEATURES: `/\\.injectable(\\.${platform})?\\.tsx?$/`,
CONTEXT_MATCHER_FOR_FEATURES: `/\\/(renderer|common)\\/.+\\.injectable(\\.${platform})?\\.tsx?$/`,
}),
new MiniCssExtractPlugin({
filename: "[name].css",
runtime: false,
}),
new optimize.LimitChunkCountPlugin({
maxChunks: 1,
}),
],
},
];
export default config;

171
webpack/library.ts
View File

@ -5,112 +5,89 @@
import path from "path";
import type webpack from "webpack";
import type { WebpackPluginInstance } from "webpack";
import { DefinePlugin } from "webpack";
import nodeExternals from "webpack-node-externals";
import ForkTsCheckerPlugin from "fork-ts-checker-webpack-plugin";
import CircularDependencyPlugin from "circular-dependency-plugin";
import MonacoWebpackPlugin from "monaco-editor-webpack-plugin";
import getTypeScriptLoader from "./get-typescript-loader";
import rendererConfig, { iconsAndImagesWebpackRules } from "./renderer";
import { buildDir, isDevelopment, mainDir } from "./vars";
import { appName, assetsFolderName, buildDir, htmlTemplate, isDevelopment, mainDir, publicPath } from "./vars";
import { platform } from "process";
import HtmlWebpackPlugin from "html-webpack-plugin";
import MiniCssExtractPlugin from "mini-css-extract-plugin";
const configs: { (): webpack.Configuration }[] = [
rendererConfig,
];
configs.push((): webpack.Configuration => {
console.info("WEBPACK:library", {
isDevelopment,
buildDir,
});
return {
name: "lens-app-library",
context: __dirname,
target: "electron-main",
mode: isDevelopment ? "development" : "production",
devtool: isDevelopment ? "cheap-module-source-map" : "source-map",
cache: isDevelopment ? { type: "filesystem" } : false,
entry: {
library: path.resolve(mainDir, "..", "library.ts"),
},
output: {
path: path.join(buildDir, "library"),
library: {
type: "commonjs",
const renderer: webpack.Configuration = ({
...rendererConfig({ showVars: false }),
plugins: [
// see also: https://github.com/Microsoft/monaco-editor-webpack-plugin#options
new MonacoWebpackPlugin({
// publicPath: "/",
// filename: "[name].worker.js",
languages: ["json", "yaml"],
globalAPI: isDevelopment,
}),
new HtmlWebpackPlugin({
filename: `${appName}.html`,
template: htmlTemplate,
inject: true,
hash: true,
templateParameters: {
assetPath: `${publicPath}${assetsFolderName}`,
},
},
resolve: {
extensions: [".json", ".js", ".ts"],
},
externals: [
nodeExternals(),
],
module: {
rules: [
{
test: /\.node$/,
use: "node-loader",
},
{
test: /\.tsx?$/,
loader: "ts-loader",
options: {
compilerOptions: {
declaration: true, // output .d.ts
sourceMap: false, // to override sourceMap: true in tsconfig.json
outDir: path.join(buildDir, "library"),
},
},
},
...iconsAndImagesWebpackRules(),
],
},
plugins: [
new DefinePlugin({
CONTEXT_MATCHER_FOR_NON_FEATURES: `/\\.injectable(\\.${platform})?\\.tsx?$/`,
CONTEXT_MATCHER_FOR_FEATURES: `/\\/(main|common)\\/.+\\.injectable(\\.${platform})?\\.tsx?$/`,
}),
],
};
}),
new MiniCssExtractPlugin({
filename: "[name].css",
}),
],
});
configs.push((): webpack.Configuration => {
console.info("WEBPACK:library:download-binaries", {
isDevelopment,
buildDir,
});
return {
name: "lens-app-library-download-binaries",
context: __dirname,
target: "electron-main",
mode: isDevelopment ? "development" : "production",
devtool: false,
cache: isDevelopment ? { type: "filesystem" } : false,
entry: {
download_binaries: path.resolve(process.cwd(), "build", "download_binaries.ts"),
},
output: {
path: path.join(buildDir, "library"),
},
resolve: {
extensions: [".json", ".js", ".ts"],
},
externals: [
nodeExternals(),
const main: webpack.Configuration = ({
name: "lens-app-main",
context: __dirname,
target: "electron-main",
mode: isDevelopment ? "development" : "production",
devtool: isDevelopment ? "cheap-module-source-map" : "source-map",
cache: isDevelopment ? { type: "filesystem" } : false,
entry: {
main: path.resolve(mainDir, "index.ts"),
},
output: {
libraryTarget: "global",
path: buildDir,
},
resolve: {
extensions: [".json", ".js", ".ts"],
},
externals: [
nodeExternals(),
],
module: {
rules: [
{
test: /\.node$/,
use: "node-loader",
},
getTypeScriptLoader({}, /\.ts$/),
...iconsAndImagesWebpackRules(),
],
module: {
rules: [
{
test: /\.node$/,
use: "node-loader",
},
getTypeScriptLoader({}, /\.ts$/),
...iconsAndImagesWebpackRules(),
],
},
plugins: [
],
};
},
plugins: [
new DefinePlugin({
CONTEXT_MATCHER_FOR_NON_FEATURES: `/\\.injectable(\\.${platform})?\\.tsx?$/`,
CONTEXT_MATCHER_FOR_FEATURES: `/\\/(main|common)\\/.+\\.injectable(\\.${platform})?\\.tsx?$/`,
}),
new ForkTsCheckerPlugin(),
new CircularDependencyPlugin({
cwd: __dirname,
exclude: /node_modules/,
failOnError: true,
}) as unknown as WebpackPluginInstance,
],
});
export default configs;
export {
main,
renderer,
};

5
webpack/renderer.ts
View File

@ -38,7 +38,7 @@ export function webpackLensRenderer({ showVars = true } = {}): webpack.Configura
devtool: isDevelopment ? "cheap-module-source-map" : "source-map",
cache: isDevelopment ? { type: "filesystem" } : false,
entry: {
[appName]: path.resolve(rendererDir, "bootstrap.tsx"),
[appName]: path.resolve(rendererDir, "index.ts"),
},
output: {
libraryTarget: "global",
@ -65,6 +65,7 @@ export function webpackLensRenderer({ showVars = true } = {}): webpack.Configura
},
externals: {
"node-fetch": "commonjs node-fetch",
"npm": "commonjs npm",
},
optimization: {
minimize: false,
@ -192,7 +193,7 @@ export function cssModulesWebpackRule({ styleLoader }: CssModulesWebpackRuleOpti
sourceMap: isDevelopment,
postcssOptions: {
plugins: [
"tailwindcss",
["tailwindcss", { config: path.resolve(__dirname, "..", "tailwind.config.js") }],
],
},
},

8
webpack/vars.ts
View File

@ -10,16 +10,16 @@ import packageInfo from "../package.json";
export const isDevelopment = process.env.NODE_ENV !== "production";
export const mainDir = path.join(process.cwd(), "src", "main");
export const buildDir = path.join(process.cwd(), "static", "build");
export const extensionEntry = path.join(process.cwd(), "src", "extensions", "extension-api.ts");
export const extensionOutDir = path.join(process.cwd(), "src", "extensions", "npm", "extensions", "dist");
export const extensionEntry = path.join(__dirname, "..", "src", "extensions", "extension-api.ts");
export const extensionOutDir = path.join(__dirname, "..", "src", "extensions", "npm", "extensions", "dist");
export const assetsFolderName = "assets";
export const rendererDir = path.join(process.cwd(), "src", "renderer");
export const appName = isDevelopment
? `${packageInfo.productName}Dev`
: packageInfo.productName;
export const htmlTemplate = path.resolve(rendererDir, "template.html");
export const htmlTemplate = path.resolve(__dirname, "..", "src/renderer", "template.html");
export const publicPath = "/build/";
export const sassCommonVars = path.resolve(rendererDir, "components/vars.scss");
export const sassCommonVars = path.resolve(__dirname, "..", "src", "renderer", "components/vars.scss");
export const webpackDevServerPort = Number(process.env.WEBPACK_DEV_SERVER_PORT) || 9191;
assert(Number.isInteger(webpackDevServerPort), "WEBPACK_DEV_SERVER_PORT environment variable must only be an integer");