From f74e533280ae8533e048c1da4ef8a12608163d25 Mon Sep 17 00:00:00 2001 From: Sebastian Malton Date: Thu, 10 Mar 2022 17:38:25 -0500 Subject: [PATCH] Remove webpack.*.ts importing values from src/ - Remove global modifying __static Signed-off-by: Sebastian Malton --- package.json | 8 +-- src/common/utils/defineGlobal.ts | 18 ------- src/common/utils/index.ts | 1 - src/common/vars.ts | 27 +++------- src/common/vars/context-dir.injectable.ts | 14 ----- .../extension-discovery.ts | 4 +- src/main/index.ts | 4 +- src/main/router.ts | 9 ++-- src/main/tray/tray.ts | 4 +- .../lens-templates.injectable.ts | 4 +- tsconfig.json | 9 +++- types/mocks.d.ts | 3 -- webpack.dev-server.ts | 53 ------------------- webpack/dev-server.ts | 46 ++++++++++++++++ .../extensions.ts | 14 ++--- .../get-typescript-loader.ts | 8 ++- webpack.main.ts => webpack/main.ts | 20 ++++--- webpack.renderer.ts => webpack/renderer.ts | 44 +++++++++------ webpack/vars.ts | 27 ++++++++++ 19 files changed, 150 insertions(+), 167 deletions(-) delete mode 100755 src/common/utils/defineGlobal.ts delete mode 100644 src/common/vars/context-dir.injectable.ts delete mode 100644 webpack.dev-server.ts create mode 100644 webpack/dev-server.ts rename webpack.extensions.ts => webpack/extensions.ts (87%) rename src/common/getTSLoader.ts => webpack/get-typescript-loader.ts (84%) rename webpack.main.ts => webpack/main.ts (77%) rename webpack.renderer.ts => webpack/renderer.ts (84%) create mode 100644 webpack/vars.ts diff --git a/package.json b/package.json index 5d09591f288f..f320d8c20029 100644 --- a/package.json +++ b/package.json @@ -17,11 +17,11 @@ "debug-build": "concurrently yarn:compile:main yarn:compile:extension-types", "dev-run": "nodemon --watch ./static/build/main.js --exec \"electron --remote-debugging-port=9223 --inspect .\"", "dev:main": "yarn run compile:main --watch --progress", - "dev:renderer": "yarn run ts-node webpack.dev-server.ts", + "dev:renderer": "yarn run ts-node webpack/dev-server.ts", "compile": "env NODE_ENV=production concurrently yarn:compile:*", - "compile:main": "yarn run webpack --config webpack.main.ts", - "compile:renderer": "yarn run webpack --config webpack.renderer.ts", - "compile:extension-types": "yarn run webpack --config webpack.extensions.ts", + "compile:main": "yarn run webpack --config webpack/main.ts", + "compile:renderer": "yarn run webpack --config webpack/renderer.ts", + "compile:extension-types": "yarn run webpack --config webpack/extensions.ts", "npm:fix-build-version": "yarn run ts-node build/set_build_version.ts", "npm:fix-package-version": "yarn run ts-node build/set_npm_version.ts", "build:linux": "yarn run compile && electron-builder --linux --dir", diff --git a/src/common/utils/defineGlobal.ts b/src/common/utils/defineGlobal.ts deleted file mode 100755 index 50d685dc5aff..000000000000 --- a/src/common/utils/defineGlobal.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright (c) OpenLens Authors. All rights reserved. - * Licensed under MIT License. See LICENSE in root directory for more information. - */ - -// Setup variable in global scope (top-level object) -// Global type definition must be added separately to `mocks.d.ts` in form: -// declare const __globalName: any; - -export function defineGlobal(propName: string, descriptor: PropertyDescriptor) { - const scope = typeof global !== "undefined" ? global : window; - - if (Object.prototype.hasOwnProperty.call(scope, propName)) { - return; - } - - Object.defineProperty(scope, propName, descriptor); -} diff --git a/src/common/utils/index.ts b/src/common/utils/index.ts index 0ecb4bc71e06..eab32393504b 100644 --- a/src/common/utils/index.ts +++ b/src/common/utils/index.ts @@ -20,7 +20,6 @@ export * from "./collection-functions"; export * from "./convertCpu"; export * from "./convertMemory"; export * from "./debouncePromise"; -export * from "./defineGlobal"; export * from "./delay"; export * from "./disposer"; export * from "./downloadFile"; diff --git a/src/common/vars.ts b/src/common/vars.ts index 1b9b9a92d1ff..7e4e639138cc 100644 --- a/src/common/vars.ts +++ b/src/common/vars.ts @@ -7,7 +7,6 @@ import path from "path"; import { SemVer } from "semver"; import packageInfo from "../../package.json"; -import { defineGlobal } from "./utils/defineGlobal"; import { lazyInitialized } from "./utils/lazy-initialized"; export const isMac = process.platform === "darwin"; @@ -78,26 +77,12 @@ export const helmBinaryName = getBinaryName("helm"); export const helmBinaryPath = lazyInitialized(() => path.join(baseBinariesDir.get(), helmBinaryName)); export const kubectlBinaryName = getBinaryName("kubectl"); export const kubectlBinaryPath = lazyInitialized(() => path.join(baseBinariesDir.get(), kubectlBinaryName)); - -// Webpack build paths -export const contextDir = process.cwd(); -export const buildDir = path.join(contextDir, "static", publicPath); -export const preloadEntrypoint = path.join(contextDir, "src/preload.ts"); -export const mainDir = path.join(contextDir, "src/main"); -export const rendererDir = path.join(contextDir, "src/renderer"); -export const htmlTemplate = path.resolve(rendererDir, "template.html"); -export const sassCommonVars = path.resolve(rendererDir, "components/vars.scss"); - -// Special runtime paths -defineGlobal("__static", { - get() { - const root = isDevelopment - ? contextDir - : (process.resourcesPath ?? contextDir); - - return path.resolve(root, "static"); - }, -}); +export const staticFilesDirectory = path.resolve( + isDevelopment + ? process.cwd() + : process.resourcesPath, + "static", +); // Apis export const apiPrefix = "/api" as string; // local router apis diff --git a/src/common/vars/context-dir.injectable.ts b/src/common/vars/context-dir.injectable.ts deleted file mode 100644 index 09484cc81635..000000000000 --- a/src/common/vars/context-dir.injectable.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) OpenLens Authors. All rights reserved. - * Licensed under MIT License. See LICENSE in root directory for more information. - */ -import { getInjectable, lifecycleEnum } from "@ogre-tools/injectable"; -import { contextDir } from "../vars"; - -const contextDirInjectable = getInjectable({ - id: "context-dir", - instantiate: () => contextDir, - lifecycle: lifecycleEnum.singleton, -}); - -export default contextDirInjectable; diff --git a/src/extensions/extension-discovery/extension-discovery.ts b/src/extensions/extension-discovery/extension-discovery.ts index 0bb6f4f08a5d..846a13f17e92 100644 --- a/src/extensions/extension-discovery/extension-discovery.ts +++ b/src/extensions/extension-discovery/extension-discovery.ts @@ -16,7 +16,7 @@ import logger from "../../main/logger"; import type { ExtensionsStore } from "../extensions-store/extensions-store"; import type { ExtensionLoader } from "../extension-loader"; import type { LensExtensionId, LensExtensionManifest } from "../lens-extension"; -import { isProduction } from "../../common/vars"; +import { isProduction, staticFilesDirectory } from "../../common/vars"; import type { ExtensionInstallationStateStore } from "../extension-installation-state-store/extension-installation-state-store"; import type { PackageJson } from "type-fest"; import { extensionDiscoveryStateChannel } from "../../common/ipc/extension-handling"; @@ -112,7 +112,7 @@ export class ExtensionDiscovery { } get inTreeFolderPath(): string { - return path.resolve(__static, "../extensions"); + return path.resolve(staticFilesDirectory, "../extensions"); } get nodeModulesPath(): string { diff --git a/src/main/index.ts b/src/main/index.ts index 2366a8036a1b..250adf0ba992 100644 --- a/src/main/index.ts +++ b/src/main/index.ts @@ -11,7 +11,7 @@ import httpProxy from "http-proxy"; import * as LensExtensionsCommonApi from "../extensions/common-api"; import * as LensExtensionsMainApi from "../extensions/main-api"; import { app, autoUpdater, dialog, powerMonitor } from "electron"; -import { appName, isIntegrationTesting, isMac, isWindows, productName } from "../common/vars"; +import { appName, isIntegrationTesting, isMac, isWindows, productName, staticFilesDirectory } from "../common/vars"; import { LensProxy } from "./lens-proxy"; import { WindowManager } from "./window-manager"; import { ClusterManager } from "./cluster-manager"; @@ -133,7 +133,7 @@ di.runSetups().then(() => { powerMonitor.on("shutdown", () => app.exit()); - registerFileProtocol("static", __static); + registerFileProtocol("static", staticFilesDirectory); PrometheusProviderRegistry.createInstance(); initializers.initPrometheusProviderRegistry(); diff --git a/src/main/router.ts b/src/main/router.ts index b0b51a1b2f06..f0d70224e5fc 100644 --- a/src/main/router.ts +++ b/src/main/router.ts @@ -10,7 +10,7 @@ import type httpProxy from "http-proxy"; import path from "path"; import { readFile } from "fs-extra"; import type { Cluster } from "../common/cluster/cluster"; -import { apiPrefix, appName, publicPath } from "../common/vars"; +import { apiPrefix, appName, publicPath, staticFilesDirectory } from "../common/vars"; import { HelmApiRoute, KubeconfigRoute, MetricsRoute, PortForwardRoute, ResourceApplierApiRoute, VersionRoute } from "./routes"; import logger from "./logger"; @@ -69,7 +69,6 @@ interface Dependencies { export class Router { protected router = new Call.Router(); - protected static rootPath = path.resolve(__static); public constructor(private dependencies: Dependencies) { this.addRoutes(); @@ -117,10 +116,10 @@ export class Router { let filePath = params.path; for (let retryCount = 0; retryCount < 5; retryCount += 1) { - const asset = path.join(Router.rootPath, filePath); + const asset = path.join(staticFilesDirectory, filePath); const normalizedFilePath = path.resolve(asset); - if (!normalizedFilePath.startsWith(Router.rootPath)) { + if (!normalizedFilePath.startsWith(staticFilesDirectory)) { response.statusCode = 404; return response.end(); @@ -162,7 +161,7 @@ export class Router { } else { this.router.add({ method: "get", path: "/{path*}" }, Router.handleStaticFile); } - + this.router.add({ method: "get", path: "/version" }, VersionRoute.getVersion); this.router.add({ method: "get", path: `${apiPrefix}/kubeconfig/service-account/{namespace}/{account}` }, KubeconfigRoute.routeServiceAccountRoute); diff --git a/src/main/tray/tray.ts b/src/main/tray/tray.ts index b4e8a24a8c31..5291d401f571 100644 --- a/src/main/tray/tray.ts +++ b/src/main/tray/tray.ts @@ -11,7 +11,7 @@ import { showAbout } from "../menu/menu"; import { checkForUpdates, isAutoUpdateEnabled } from "../app-updater"; import type { WindowManager } from "../window-manager"; import logger from "../logger"; -import { isDevelopment, isWindows, productName } from "../../common/vars"; +import { isDevelopment, isWindows, productName, staticFilesDirectory } from "../../common/vars"; import { exitApp } from "../exit-app"; import { preferencesURL } from "../../common/routes"; import { toJS } from "../../common/utils"; @@ -24,7 +24,7 @@ export let tray: Tray; export function getTrayIcon(): string { return path.resolve( - __static, + staticFilesDirectory, isDevelopment ? "../build/tray" : "icons", // copied within electron-builder extras "trayIconTemplate.png", ); diff --git a/src/renderer/components/dock/create-resource/lens-templates.injectable.ts b/src/renderer/components/dock/create-resource/lens-templates.injectable.ts index a83b33011def..0d5b65618082 100644 --- a/src/renderer/components/dock/create-resource/lens-templates.injectable.ts +++ b/src/renderer/components/dock/create-resource/lens-templates.injectable.ts @@ -5,7 +5,7 @@ import { getInjectable } from "@ogre-tools/injectable"; import path from "path"; import { hasCorrectExtension } from "./has-correct-extension"; -import "../../../../common/vars"; +import { staticFilesDirectory } from "../../../../common/vars"; import readFileInjectable from "../../../../common/fs/read-file.injectable"; import readDirInjectable from "../../../../common/fs/read-dir.injectable"; import type { RawTemplates } from "./create-resource-templates.injectable"; @@ -16,7 +16,7 @@ interface Dependencies { } async function getTemplates({ readDir, readFile }: Dependencies) { - const templatesFolder = path.resolve(__static, "../templates/create-resource"); + const templatesFolder = path.resolve(staticFilesDirectory, "../templates/create-resource"); /** * Mapping between file names and their contents diff --git a/tsconfig.json b/tsconfig.json index 9cd814d6d682..6b995d08e630 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -32,7 +32,11 @@ "types/*" ] }, - "plugins": [{ "name": "typescript-plugin-css-modules" }] + "plugins": [ + { + "name": "typescript-plugin-css-modules" + } + ] }, "ts-node": { "transpileOnly": true, @@ -42,7 +46,8 @@ }, "include": [ "src/**/*", - "types/*.d.ts" + "types/*.d.ts", + "webpack/*.ts" ], "exclude": [ "node_modules", diff --git a/types/mocks.d.ts b/types/mocks.d.ts index 0fbde3b4f9fb..17dba848b790 100644 --- a/types/mocks.d.ts +++ b/types/mocks.d.ts @@ -8,9 +8,6 @@ declare module "win-ca/api" declare module "@hapi/call" declare module "@hapi/subtext" -// Global path to static assets -declare const __static: string; - // Support import for custom module extensions // https://www.typescriptlang.org/docs/handbook/modules.html#wildcard-module-declarations declare module "*.module.scss" { diff --git a/webpack.dev-server.ts b/webpack.dev-server.ts deleted file mode 100644 index 487c89c024bf..000000000000 --- a/webpack.dev-server.ts +++ /dev/null @@ -1,53 +0,0 @@ -/** - * Copyright (c) OpenLens Authors. All rights reserved. - * Licensed under MIT License. See LICENSE in root directory for more information. - */ - -import Webpack from "webpack"; -import WebpackDevServer from "webpack-dev-server"; -import { webpackLensRenderer } from "./webpack.renderer"; -import { buildDir } from "./src/common/vars"; -import logger from "./src/common/logger"; - -/** - * Creates `webpack-dev-server` - * API docs: - * @url https://webpack.js.org/configuration/dev-server/ - * @url https://github.com/chimurai/http-proxy-middleware - */ -function createDevServer(): WebpackDevServer { - const config = webpackLensRenderer({ showVars: false }); - const compiler = Webpack(config); - - const server = new WebpackDevServer({ - setupExitSignals: true, - headers: { - "Access-Control-Allow-Origin": "*", - }, - allowedHosts: "all", - host: "localhost", - static: buildDir, // aka `devServer.contentBase` in webpack@4 - hot: "only", // use HMR only without errors - liveReload: false, - devMiddleware: { - writeToDisk: false, - index: "OpenLensDev.html", - publicPath: "/build", - }, - proxy: { - "^/$": "/build/", - }, - client: { - overlay: false, // don't show warnings and errors on top of rendered app view - logging: "error", - }, - }, compiler); - - logger.info(`[WEBPACK-DEV-SERVER]: created with options`, server.options); - - return server; -} - -const server = createDevServer(); - -server.start(); diff --git a/webpack/dev-server.ts b/webpack/dev-server.ts new file mode 100644 index 000000000000..3614d56f937d --- /dev/null +++ b/webpack/dev-server.ts @@ -0,0 +1,46 @@ +/** + * Copyright (c) OpenLens Authors. All rights reserved. + * Licensed under MIT License. See LICENSE in root directory for more information. + */ + +import Webpack from "webpack"; +import WebpackDevServer from "webpack-dev-server"; +import { webpackLensRenderer } from "./renderer"; +import logger from "../src/common/logger"; +import { buildDir } from "./vars"; + +/** + * API docs: + * @url https://webpack.js.org/configuration/dev-server/ + * @url https://github.com/chimurai/http-proxy-middleware + */ +const config = webpackLensRenderer({ showVars: false }); +const compiler = Webpack(config); + +const server = new WebpackDevServer({ + setupExitSignals: true, + headers: { + "Access-Control-Allow-Origin": "*", + }, + allowedHosts: "all", + host: "localhost", + static: buildDir, // aka `devServer.contentBase` in webpack@4 + hot: "only", // use HMR only without errors + liveReload: false, + devMiddleware: { + writeToDisk: false, + index: "OpenLensDev.html", + publicPath: "/build", + }, + proxy: { + "^/$": "/build/", + }, + client: { + overlay: false, // don't show warnings and errors on top of rendered app view + logging: "error", + }, +}, compiler); + +logger.info(`[WEBPACK-DEV-SERVER]: created with options`, server.options); + +server.start(); diff --git a/webpack.extensions.ts b/webpack/extensions.ts similarity index 87% rename from webpack.extensions.ts rename to webpack/extensions.ts index 57064a14beb6..961c1d3bf285 100644 --- a/webpack.extensions.ts +++ b/webpack/extensions.ts @@ -6,25 +6,21 @@ import path from "path"; import type webpack from "webpack"; -import * as vars from "./src/common/vars"; -import { cssModulesWebpackRule, fontsLoaderWebpackRules, iconsAndImagesWebpackRules } from "./webpack.renderer"; +import { cssModulesWebpackRule, fontsLoaderWebpackRules, iconsAndImagesWebpackRules } from "./renderer"; +import { extensionEntry, extensionOutDir, isDevelopment } from "./vars"; export default function generateExtensionTypes(): webpack.Configuration { - const { isDevelopment } = vars; - const entry = "./src/extensions/extension-api.ts"; - const outDir = "./src/extensions/npm/extensions/dist"; - return { // Compile for Electron for renderer process // see target: "electron-renderer", - entry, + entry: extensionEntry, // this is the default mode, so we should make it explicit to silence the warning mode: isDevelopment ? "development" : "production", output: { filename: "extension-api.js", // need to be an absolute path - path: path.resolve(__dirname, `${outDir}/src/extensions`), + path: path.resolve(extensionOutDir, "src", "extensions"), // can be use in commonjs environments // e.g. require('@k8slens/extensions') libraryTarget: "commonjs", @@ -54,7 +50,7 @@ export default function generateExtensionTypes(): webpack.Configuration { compilerOptions: { declaration: true, // output .d.ts sourceMap: false, // to override sourceMap: true in tsconfig.json - outDir, // where the .d.ts should be located + outDir: extensionOutDir, // where the .d.ts should be located }, }, }, diff --git a/src/common/getTSLoader.ts b/webpack/get-typescript-loader.ts similarity index 84% rename from src/common/getTSLoader.ts rename to webpack/get-typescript-loader.ts index 6eb670bf077a..895b59a69227 100644 --- a/src/common/getTSLoader.ts +++ b/webpack/get-typescript-loader.ts @@ -11,7 +11,7 @@ import type { Options as TSLoaderOptions } from "ts-loader"; * depends on env LENS_DEV_USE_ESBUILD_LOADER to use esbuild-loader (faster) or good-old ts-loader * @returns ts/tsx webpack loader configuration object */ -const getTSLoader = (options: Partial = {}, testRegExp?: RegExp) => { +export default function getTypescriptLoader(options: Partial = {}, testRegExp?: RegExp) { testRegExp ??= /\.tsx?$/; // by default covers react/jsx-stuff options.transpileOnly ??= true; @@ -23,7 +23,7 @@ const getTSLoader = (options: Partial = {}, testRegExp?: RegExp loader: "esbuild-loader", options: { loader: "tsx", - target: "ES2019", // supported by >= electron@14 + target: "ES2019", implementation: esbuild, }, }; @@ -37,6 +37,4 @@ const getTSLoader = (options: Partial = {}, testRegExp?: RegExp options, }, }; -}; - -export default getTSLoader; +} diff --git a/webpack.main.ts b/webpack/main.ts similarity index 77% rename from webpack.main.ts rename to webpack/main.ts index db742f44e60c..397ffb2968ca 100755 --- a/webpack.main.ts +++ b/webpack/main.ts @@ -7,16 +7,20 @@ import path from "path"; import type webpack from "webpack"; import ForkTsCheckerPlugin from "fork-ts-checker-webpack-plugin"; import nodeExternals from "webpack-node-externals"; -import * as vars from "./src/common/vars"; -import getTSLoader from "./src/common/getTSLoader"; +import getTypeScriptLoader from "./get-typescript-loader"; import CircularDependencyPlugin from "circular-dependency-plugin"; -import { iconsAndImagesWebpackRules } from "./webpack.renderer"; +import { iconsAndImagesWebpackRules } from "./renderer"; +import type { WebpackPluginInstance } from "webpack"; +import { buildDir, isDevelopment, mainDir } from "./vars"; const configs: { (): webpack.Configuration }[] = []; configs.push((): webpack.Configuration => { - console.info("WEBPACK:main", { ...vars }); - const { mainDir, buildDir, isDevelopment } = vars; + console.info("WEBPACK:main", { + isDevelopment, + mainDir, + buildDir, + }); return { name: "lens-app-main", @@ -44,7 +48,7 @@ configs.push((): webpack.Configuration => { test: /\.node$/, use: "node-loader", }, - getTSLoader({}, /\.ts$/), + getTypeScriptLoader({}, /\.ts$/), ...iconsAndImagesWebpackRules(), ], }, @@ -54,8 +58,8 @@ configs.push((): webpack.Configuration => { cwd: __dirname, exclude: /node_modules/, failOnError: true, - }), - ].filter(Boolean), + }) as unknown as WebpackPluginInstance, + ], }; }); diff --git a/webpack.renderer.ts b/webpack/renderer.ts similarity index 84% rename from webpack.renderer.ts rename to webpack/renderer.ts index 7b21f9214e09..126a0e25cfc2 100755 --- a/webpack.renderer.ts +++ b/webpack/renderer.ts @@ -3,25 +3,31 @@ * Licensed under MIT License. See LICENSE in root directory for more information. */ -import * as vars from "./src/common/vars"; import path from "path"; import type webpack from "webpack"; import HtmlWebpackPlugin from "html-webpack-plugin"; import MiniCssExtractPlugin from "mini-css-extract-plugin"; import ForkTsCheckerPlugin from "fork-ts-checker-webpack-plugin"; import MonacoWebpackPlugin from "monaco-editor-webpack-plugin"; -import getTSLoader from "./src/common/getTSLoader"; import CircularDependencyPlugin from "circular-dependency-plugin"; import ReactRefreshWebpackPlugin from "@pmmmwh/react-refresh-webpack-plugin"; +import type { WebpackPluginInstance } from "webpack"; +import getTypescriptLoader from "./get-typescript-loader"; +import { assetsFolderName, isDevelopment, rendererDir, buildDir, appName, htmlTemplate, publicPath, sassCommonVars, ignoreIf } from "./vars"; export function webpackLensRenderer({ showVars = true } = {}): webpack.Configuration { if (showVars) { - console.info("WEBPACK:renderer", { ...vars }); + console.info("WEBPACK:renderer", { + assetsFolderName, + isDevelopment, + rendererDir, + buildDir, + appName, + htmlTemplate, + publicPath, + }); } - const assetsFolderName = "assets"; - const { appName, buildDir, htmlTemplate, isDevelopment, publicPath, rendererDir } = vars; - return { target: "electron-renderer", name: "lens-app-renderer", @@ -67,7 +73,7 @@ export function webpackLensRenderer({ showVars = true } = {}): webpack.Configura test: /\.node$/, use: "node-loader", }, - getTSLoader({ + getTypescriptLoader({ getCustomTransformers: () => ({ before: isDevelopment ? [require("react-refresh-typescript")()] : [], }), @@ -103,14 +109,16 @@ export function webpackLensRenderer({ showVars = true } = {}): webpack.Configura cwd: __dirname, exclude: /node_modules/, failOnError: true, - }), + }) as unknown as WebpackPluginInstance, new MiniCssExtractPlugin({ filename: "[name].css", }), - isDevelopment && new ReactRefreshWebpackPlugin(), - ].filter(Boolean), + ...ignoreIf(isDevelopment, [ + new ReactRefreshWebpackPlugin(), + ]), + ], }; } @@ -143,15 +151,19 @@ export function fontsLoaderWebpackRules(): webpack.RuleSetRule[] { ]; } +export interface CssModulesWebpackRuleOptions { + styleLoader?: string; +} + /** * Import CSS or SASS styles with modules support (*.module.scss) - * @param {string} styleLoader */ -export function cssModulesWebpackRule( - { - styleLoader = vars.isDevelopment ? "style-loader" : MiniCssExtractPlugin.loader, - } = {}): webpack.RuleSetRule { - const { isDevelopment, sassCommonVars } = vars; +export function cssModulesWebpackRule({ styleLoader }: CssModulesWebpackRuleOptions = {}): webpack.RuleSetRule { + styleLoader ??= ( + isDevelopment + ? "style-loader" + : MiniCssExtractPlugin.loader + ); return { test: /\.s?css$/, diff --git a/webpack/vars.ts b/webpack/vars.ts new file mode 100644 index 000000000000..d4737fd9ef0b --- /dev/null +++ b/webpack/vars.ts @@ -0,0 +1,27 @@ +/** + * Copyright (c) OpenLens Authors. All rights reserved. + * Licensed under MIT License. See LICENSE in root directory for more information. + */ + +import path from "path"; +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 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 publicPath = "/build/"; +export const sassCommonVars = path.resolve(rendererDir, "components/vars.scss"); + +export function ignoreIf(check: boolean, src: T[]): T[] { + return check + ? [] + : src; +}