From 84b1e3528ed142f0aa6917baae8471616d1a49e8 Mon Sep 17 00:00:00 2001 From: Andreas Coroiu Date: Mon, 1 Sep 2025 16:03:37 +0200 Subject: [PATCH] feat: refactor webpack config --- apps/browser/webpack.base.js | 437 ++++++++++++++++++ apps/browser/webpack.config.js | 420 +---------------- bitwarden_license/bit-browser/tsconfig.json | 12 +- .../bit-browser/webpack.config.js | 25 +- 4 files changed, 466 insertions(+), 428 deletions(-) create mode 100644 apps/browser/webpack.base.js diff --git a/apps/browser/webpack.base.js b/apps/browser/webpack.base.js new file mode 100644 index 00000000000..bed4d3ac666 --- /dev/null +++ b/apps/browser/webpack.base.js @@ -0,0 +1,437 @@ +const path = require("path"); +const webpack = require("webpack"); +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const CopyWebpackPlugin = require("copy-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const { AngularWebpackPlugin } = require("@ngtools/webpack"); +const TerserPlugin = require("terser-webpack-plugin"); +const { TsconfigPathsPlugin } = require("tsconfig-paths-webpack-plugin"); +const configurator = require("./config/config"); +const manifest = require("./webpack/manifest"); +const AngularCheckPlugin = require("./webpack/angular-check"); + +/** + * @param {{ + * popup: { + * entry: string; + * entryModule: string; + * }; + * background: { + * entry: string; + * }; + * tsConfig: string; + * additionalEntries?: { [outputPath: string]: string } + * }} params - The parameters for building the config. + */ +function buildConfig(params) { + if (process.env.NODE_ENV == null) { + process.env.NODE_ENV = "development"; + } + const ENV = (process.env.ENV = process.env.NODE_ENV); + const manifestVersion = process.env.MANIFEST_VERSION == 3 ? 3 : 2; + const browser = process.env.BROWSER ?? "chrome"; + + console.log(`Building Manifest Version ${manifestVersion} app`); + + const envConfig = configurator.load(ENV); + configurator.log(envConfig); + + const moduleRules = [ + { + test: /\.(html)$/, + loader: "html-loader", + }, + { + test: /.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/, + exclude: /loading.svg/, + generator: { + filename: "popup/fonts/[name].[contenthash][ext]", + }, + type: "asset/resource", + }, + { + test: /\.(jpe?g|png|gif|svg)$/i, + exclude: /.*(bwi-font|glyphicons-halflings-regular)\.svg/, + generator: { + filename: "popup/images/[name][ext]", + }, + type: "asset/resource", + }, + { + test: /\.css$/, + use: [ + { + loader: MiniCssExtractPlugin.loader, + }, + "css-loader", + "resolve-url-loader", + { + loader: "postcss-loader", + options: { + sourceMap: true, + }, + }, + ], + }, + { + test: /\.scss$/, + use: [ + { + loader: MiniCssExtractPlugin.loader, + }, + "css-loader", + "resolve-url-loader", + { + loader: "sass-loader", + options: { + sourceMap: true, + }, + }, + ], + }, + { + test: /\.[cm]?js$/, + use: [ + { + loader: "babel-loader", + options: { + configFile: "../../babel.config.json", + cacheDirectory: ENV === "development", + compact: ENV !== "development", + }, + }, + ], + }, + { + test: /\.[jt]sx?$/, + loader: "@ngtools/webpack", + }, + ]; + + const requiredPlugins = [ + new webpack.DefinePlugin({ + "process.env": { + ENV: JSON.stringify(ENV), + }, + }), + new webpack.EnvironmentPlugin({ + FLAGS: envConfig.flags, + DEV_FLAGS: ENV === "development" ? envConfig.devFlags : {}, + }), + ]; + + const plugins = [ + new HtmlWebpackPlugin({ + template: "./src/popup/index.ejs", + filename: "popup/index.html", + chunks: ["popup/polyfills", "popup/vendor-angular", "popup/vendor", "popup/main"], + browser: browser, + }), + new HtmlWebpackPlugin({ + template: "./src/autofill/notification/bar.html", + filename: "notification/bar.html", + chunks: ["notification/bar"], + }), + new HtmlWebpackPlugin({ + template: "./src/autofill/overlay/inline-menu/pages/button/button.html", + filename: "overlay/menu-button.html", + chunks: ["overlay/menu-button"], + }), + new HtmlWebpackPlugin({ + template: "./src/autofill/overlay/inline-menu/pages/list/list.html", + filename: "overlay/menu-list.html", + chunks: ["overlay/menu-list"], + }), + new HtmlWebpackPlugin({ + template: "./src/autofill/overlay/inline-menu/pages/menu-container/menu-container.html", + filename: "overlay/menu.html", + chunks: ["overlay/menu"], + }), + new CopyWebpackPlugin({ + patterns: [ + { + from: manifestVersion == 3 ? "./src/manifest.v3.json" : "./src/manifest.json", + to: "manifest.json", + transform: manifest.transform(browser), + }, + { from: "./src/managed_schema.json", to: "managed_schema.json" }, + { from: "./src/_locales", to: "_locales" }, + { from: "./src/images", to: "images" }, + { from: "./src/popup/images", to: "popup/images" }, + { from: "./src/autofill/content/autofill.css", to: "content" }, + ], + }), + new MiniCssExtractPlugin({ + filename: "[name].css", + chunkFilename: "chunk-[id].css", + }), + new AngularWebpackPlugin({ + tsconfig: params.tsConfig, + entryModule: params.popup.entryModule, + sourceMap: true, + }), + new webpack.ProvidePlugin({ + process: "process/browser.js", + }), + new webpack.SourceMapDevToolPlugin({ + exclude: [/content\/.*/, /notification\/.*/, /overlay\/.*/], + filename: "[file].map", + }), + ...requiredPlugins, + ]; + + /** + * @type {import("webpack").Configuration} + * This config compiles everything but the background + */ + const mainConfig = { + name: "main", + mode: ENV, + devtool: false, + entry: { + "popup/polyfills": "./src/popup/polyfills.ts", + "popup/main": params.popup.entry, + "content/trigger-autofill-script-injection": + "./src/autofill/content/trigger-autofill-script-injection.ts", + "content/bootstrap-autofill": "./src/autofill/content/bootstrap-autofill.ts", + "content/bootstrap-autofill-overlay": "./src/autofill/content/bootstrap-autofill-overlay.ts", + "content/bootstrap-autofill-overlay-menu": + "./src/autofill/content/bootstrap-autofill-overlay-menu.ts", + "content/bootstrap-autofill-overlay-notifications": + "./src/autofill/content/bootstrap-autofill-overlay-notifications.ts", + "content/autofiller": "./src/autofill/content/autofiller.ts", + "content/auto-submit-login": "./src/autofill/content/auto-submit-login.ts", + "content/contextMenuHandler": "./src/autofill/content/context-menu-handler.ts", + "content/content-message-handler": "./src/autofill/content/content-message-handler.ts", + "content/fido2-content-script": "./src/autofill/fido2/content/fido2-content-script.ts", + "content/fido2-page-script": "./src/autofill/fido2/content/fido2-page-script.ts", + "content/ipc-content-script": "./src/platform/ipc/content/ipc-content-script.ts", + "notification/bar": "./src/autofill/notification/bar.ts", + "overlay/menu-button": + "./src/autofill/overlay/inline-menu/pages/button/bootstrap-autofill-inline-menu-button.ts", + "overlay/menu-list": + "./src/autofill/overlay/inline-menu/pages/list/bootstrap-autofill-inline-menu-list.ts", + "overlay/menu": + "./src/autofill/overlay/inline-menu/pages/menu-container/bootstrap-autofill-inline-menu-container.ts", + "content/send-on-installed-message": "./src/vault/content/send-on-installed-message.ts", + "content/send-popup-open-message": "./src/vault/content/send-popup-open-message.ts", + ...params.additionalEntries, + }, + cache: + ENV !== "development" + ? false + : { + type: "filesystem", + name: "main-cache", + cacheDirectory: path.resolve( + __dirname, + "../../node_modules/.cache/webpack-browser-main", + ), + buildDependencies: { + config: [__filename], + }, + }, + snapshot: { + unmanagedPaths: [path.resolve(__dirname, "../../node_modules/@bitwarden/")], + }, + optimization: { + minimize: ENV !== "development", + minimizer: [ + new TerserPlugin({ + exclude: [/content\/.*/, /notification\/.*/, /overlay\/.*/], + terserOptions: { + // Replicate Angular CLI behaviour + compress: { + global_defs: { + ngDevMode: false, + ngI18nClosureMode: false, + }, + }, + }, + }), + ], + splitChunks: { + cacheGroups: { + commons: { + test(module, chunks) { + return ( + module.resource != null && + module.resource.includes(`${path.sep}node_modules${path.sep}`) && + !module.resource.includes(`${path.sep}node_modules${path.sep}@angular${path.sep}`) + ); + }, + name: "popup/vendor", + chunks: (chunk) => { + return chunk.name === "popup/main"; + }, + }, + angular: { + test(module, chunks) { + return ( + module.resource != null && + module.resource.includes(`${path.sep}node_modules${path.sep}@angular${path.sep}`) + ); + }, + name: "popup/vendor-angular", + chunks: (chunk) => { + return chunk.name === "popup/main"; + }, + }, + }, + }, + }, + resolve: { + extensions: [".ts", ".js"], + symlinks: false, + modules: [path.resolve("../../node_modules")], + fallback: { + assert: false, + buffer: require.resolve("buffer/"), + util: require.resolve("util/"), + url: require.resolve("url/"), + fs: false, + path: require.resolve("path-browserify"), + }, + cache: true, + }, + output: { + filename: "[name].js", + chunkFilename: "assets/[name].js", + webassemblyModuleFilename: "assets/[modulehash].wasm", + path: path.resolve(__dirname, "build"), + clean: true, + }, + module: { + rules: moduleRules, + }, + experiments: { + asyncWebAssembly: true, + }, + plugins: plugins, + }; + + /** + * @type {import("webpack").Configuration[]} + */ + const configs = []; + + if (manifestVersion == 2) { + mainConfig.optimization.splitChunks.cacheGroups.commons2 = { + test: /[\\/]node_modules[\\/]/, + name: "vendor", + chunks: (chunk) => { + return chunk.name === "background"; + }, + }; + + // Manifest V2 uses Background Pages which requires a html page. + mainConfig.plugins.push( + new HtmlWebpackPlugin({ + template: "./src/platform/background.html", + filename: "background.html", + chunks: ["vendor", "background"], + }), + ); + + // Manifest V2 background pages can be run through the regular build pipeline. + // Since it's a standard webpage. + mainConfig.entry.background = "./src/platform/background.ts"; + mainConfig.entry["content/fido2-page-script-delay-append-mv2"] = + "./src/autofill/fido2/content/fido2-page-script-delay-append.mv2.ts"; + + configs.push(mainConfig); + } else { + // Firefox does not use the offscreen API + if (browser !== "firefox") { + mainConfig.entry["offscreen-document/offscreen-document"] = + "./src/platform/offscreen-document/offscreen-document.ts"; + + mainConfig.plugins.push( + new HtmlWebpackPlugin({ + template: "./src/platform/offscreen-document/index.html", + filename: "offscreen-document/index.html", + chunks: ["offscreen-document/offscreen-document"], + }), + ); + } + + const target = browser === "firefox" ? "web" : "webworker"; + + /** + * @type {import("webpack").Configuration} + */ + const backgroundConfig = { + name: "background", + mode: ENV, + devtool: false, + entry: params.background.entry, + target: target, + output: { + filename: "background.js", + path: path.resolve(__dirname, "build"), + }, + module: { + rules: [ + { + test: /\.tsx?$/, + loader: "ts-loader", + }, + ], + }, + cache: + ENV !== "development" + ? false + : { + type: "filesystem", + name: "background-cache", + cacheDirectory: path.resolve( + __dirname, + "../../node_modules/.cache/webpack-browser-background", + ), + buildDependencies: { + config: [__filename], + }, + }, + snapshot: { + unmanagedPaths: [path.resolve(__dirname, "../../node_modules/@bitwarden/")], + }, + experiments: { + asyncWebAssembly: true, + }, + resolve: { + extensions: [".ts", ".js"], + symlinks: false, + modules: [path.resolve("../../node_modules")], + plugins: [new TsconfigPathsPlugin()], + fallback: { + fs: false, + path: require.resolve("path-browserify"), + }, + cache: true, + }, + dependencies: ["main"], + plugins: [...requiredPlugins, new AngularCheckPlugin()], + }; + + // Safari's desktop build process requires a background.html and vendor.js file to exist + // within the root of the extension. This is a workaround to allow us to build Safari + // for manifest v2 and v3 without modifying the desktop project structure. + if (browser === "safari") { + backgroundConfig.plugins.push( + new CopyWebpackPlugin({ + patterns: [ + { from: "./src/safari/mv3/fake-background.html", to: "background.html" }, + { from: "./src/safari/mv3/fake-vendor.js", to: "vendor.js" }, + ], + }), + ); + } + + configs.push(mainConfig); + configs.push(backgroundConfig); + } + + return configs; +} + +module.exports.buildConfig = buildConfig; diff --git a/apps/browser/webpack.config.js b/apps/browser/webpack.config.js index 1378a341251..25818547543 100644 --- a/apps/browser/webpack.config.js +++ b/apps/browser/webpack.config.js @@ -1,416 +1,12 @@ -const path = require("path"); -const webpack = require("webpack"); -const HtmlWebpackPlugin = require("html-webpack-plugin"); -const CopyWebpackPlugin = require("copy-webpack-plugin"); -const MiniCssExtractPlugin = require("mini-css-extract-plugin"); -const { AngularWebpackPlugin } = require("@ngtools/webpack"); -const TerserPlugin = require("terser-webpack-plugin"); -const { TsconfigPathsPlugin } = require("tsconfig-paths-webpack-plugin"); -const configurator = require("./config/config"); -const manifest = require("./webpack/manifest"); -const AngularCheckPlugin = require("./webpack/angular-check"); +const { buildConfig } = require("./webpack.base"); -if (process.env.NODE_ENV == null) { - process.env.NODE_ENV = "development"; -} -const ENV = (process.env.ENV = process.env.NODE_ENV); -const manifestVersion = process.env.MANIFEST_VERSION == 3 ? 3 : 2; -const browser = process.env.BROWSER ?? "chrome"; - -console.log(`Building Manifest Version ${manifestVersion} app`); - -const envConfig = configurator.load(ENV); -configurator.log(envConfig); - -const moduleRules = [ - { - test: /\.(html)$/, - loader: "html-loader", - }, - { - test: /.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/, - exclude: /loading.svg/, - generator: { - filename: "popup/fonts/[name].[contenthash][ext]", - }, - type: "asset/resource", - }, - { - test: /\.(jpe?g|png|gif|svg)$/i, - exclude: /.*(bwi-font|glyphicons-halflings-regular)\.svg/, - generator: { - filename: "popup/images/[name][ext]", - }, - type: "asset/resource", - }, - { - test: /\.css$/, - use: [ - { - loader: MiniCssExtractPlugin.loader, - }, - "css-loader", - "resolve-url-loader", - { - loader: "postcss-loader", - options: { - sourceMap: true, - }, - }, - ], - }, - { - test: /\.scss$/, - use: [ - { - loader: MiniCssExtractPlugin.loader, - }, - "css-loader", - "resolve-url-loader", - { - loader: "sass-loader", - options: { - sourceMap: true, - }, - }, - ], - }, - { - test: /\.[cm]?js$/, - use: [ - { - loader: "babel-loader", - options: { - configFile: "../../babel.config.json", - cacheDirectory: ENV === "development", - compact: ENV !== "development", - }, - }, - ], - }, - { - test: /\.[jt]sx?$/, - loader: "@ngtools/webpack", - }, -]; - -const requiredPlugins = [ - new webpack.DefinePlugin({ - "process.env": { - ENV: JSON.stringify(ENV), - }, - }), - new webpack.EnvironmentPlugin({ - FLAGS: envConfig.flags, - DEV_FLAGS: ENV === "development" ? envConfig.devFlags : {}, - }), -]; - -const plugins = [ - new HtmlWebpackPlugin({ - template: "./src/popup/index.ejs", - filename: "popup/index.html", - chunks: ["popup/polyfills", "popup/vendor-angular", "popup/vendor", "popup/main"], - browser: browser, - }), - new HtmlWebpackPlugin({ - template: "./src/autofill/notification/bar.html", - filename: "notification/bar.html", - chunks: ["notification/bar"], - }), - new HtmlWebpackPlugin({ - template: "./src/autofill/overlay/inline-menu/pages/button/button.html", - filename: "overlay/menu-button.html", - chunks: ["overlay/menu-button"], - }), - new HtmlWebpackPlugin({ - template: "./src/autofill/overlay/inline-menu/pages/list/list.html", - filename: "overlay/menu-list.html", - chunks: ["overlay/menu-list"], - }), - new HtmlWebpackPlugin({ - template: "./src/autofill/overlay/inline-menu/pages/menu-container/menu-container.html", - filename: "overlay/menu.html", - chunks: ["overlay/menu"], - }), - new CopyWebpackPlugin({ - patterns: [ - { - from: manifestVersion == 3 ? "./src/manifest.v3.json" : "./src/manifest.json", - to: "manifest.json", - transform: manifest.transform(browser), - }, - { from: "./src/managed_schema.json", to: "managed_schema.json" }, - { from: "./src/_locales", to: "_locales" }, - { from: "./src/images", to: "images" }, - { from: "./src/popup/images", to: "popup/images" }, - { from: "./src/autofill/content/autofill.css", to: "content" }, - ], - }), - new MiniCssExtractPlugin({ - filename: "[name].css", - chunkFilename: "chunk-[id].css", - }), - new webpack.ProvidePlugin({ - process: "process/browser.js", - }), - new webpack.SourceMapDevToolPlugin({ - exclude: [/content\/.*/, /notification\/.*/, /overlay\/.*/], - filename: "[file].map", - }), - ...requiredPlugins, - new AngularWebpackPlugin({ - tsConfigPath: "tsconfig.json", +module.exports = buildConfig({ + popup: { + entry: "./src/popup/main.ts", entryModule: "src/popup/app.module#AppModule", - sourceMap: true, - }), -]; - -/** - * @type {import("webpack").Configuration} - * This config compiles everything but the background - */ -const mainConfig = { - name: "main", - mode: ENV, - devtool: false, - entry: { - "popup/polyfills": "./src/popup/polyfills.ts", - "popup/main": "./src/popup/main.ts", - "content/trigger-autofill-script-injection": - "./src/autofill/content/trigger-autofill-script-injection.ts", - "content/bootstrap-autofill": "./src/autofill/content/bootstrap-autofill.ts", - "content/bootstrap-autofill-overlay": "./src/autofill/content/bootstrap-autofill-overlay.ts", - "content/bootstrap-autofill-overlay-menu": - "./src/autofill/content/bootstrap-autofill-overlay-menu.ts", - "content/bootstrap-autofill-overlay-notifications": - "./src/autofill/content/bootstrap-autofill-overlay-notifications.ts", - "content/autofiller": "./src/autofill/content/autofiller.ts", - "content/auto-submit-login": "./src/autofill/content/auto-submit-login.ts", - "content/contextMenuHandler": "./src/autofill/content/context-menu-handler.ts", - "content/content-message-handler": "./src/autofill/content/content-message-handler.ts", - "content/fido2-content-script": "./src/autofill/fido2/content/fido2-content-script.ts", - "content/fido2-page-script": "./src/autofill/fido2/content/fido2-page-script.ts", - "content/ipc-content-script": "./src/platform/ipc/content/ipc-content-script.ts", - "notification/bar": "./src/autofill/notification/bar.ts", - "overlay/menu-button": - "./src/autofill/overlay/inline-menu/pages/button/bootstrap-autofill-inline-menu-button.ts", - "overlay/menu-list": - "./src/autofill/overlay/inline-menu/pages/list/bootstrap-autofill-inline-menu-list.ts", - "overlay/menu": - "./src/autofill/overlay/inline-menu/pages/menu-container/bootstrap-autofill-inline-menu-container.ts", - "content/send-on-installed-message": "./src/vault/content/send-on-installed-message.ts", - "content/send-popup-open-message": "./src/vault/content/send-popup-open-message.ts", }, - cache: - ENV !== "development" - ? false - : { - type: "filesystem", - name: "main-cache", - cacheDirectory: path.resolve(__dirname, "../../node_modules/.cache/webpack-browser-main"), - buildDependencies: { - config: [__filename], - }, - }, - snapshot: { - unmanagedPaths: [path.resolve(__dirname, "../../node_modules/@bitwarden/")], - }, - optimization: { - minimize: ENV !== "development", - minimizer: [ - new TerserPlugin({ - exclude: [/content\/.*/, /notification\/.*/, /overlay\/.*/], - terserOptions: { - // Replicate Angular CLI behaviour - compress: { - global_defs: { - ngDevMode: false, - ngI18nClosureMode: false, - }, - }, - }, - }), - ], - splitChunks: { - cacheGroups: { - commons: { - test(module, chunks) { - return ( - module.resource != null && - module.resource.includes(`${path.sep}node_modules${path.sep}`) && - !module.resource.includes(`${path.sep}node_modules${path.sep}@angular${path.sep}`) - ); - }, - name: "popup/vendor", - chunks: (chunk) => { - return chunk.name === "popup/main"; - }, - }, - angular: { - test(module, chunks) { - return ( - module.resource != null && - module.resource.includes(`${path.sep}node_modules${path.sep}@angular${path.sep}`) - ); - }, - name: "popup/vendor-angular", - chunks: (chunk) => { - return chunk.name === "popup/main"; - }, - }, - }, - }, - }, - resolve: { - extensions: [".ts", ".js"], - symlinks: false, - modules: [path.resolve("../../node_modules")], - fallback: { - assert: false, - buffer: require.resolve("buffer/"), - util: require.resolve("util/"), - url: require.resolve("url/"), - fs: false, - path: require.resolve("path-browserify"), - }, - cache: true, - }, - output: { - filename: "[name].js", - chunkFilename: "assets/[name].js", - webassemblyModuleFilename: "assets/[modulehash].wasm", - path: path.resolve(__dirname, "build"), - clean: true, - }, - module: { - rules: moduleRules, - }, - experiments: { - asyncWebAssembly: true, - }, - plugins: plugins, -}; - -/** - * @type {import("webpack").Configuration[]} - */ -const configs = []; - -if (manifestVersion == 2) { - mainConfig.optimization.splitChunks.cacheGroups.commons2 = { - test: /[\\/]node_modules[\\/]/, - name: "vendor", - chunks: (chunk) => { - return chunk.name === "background"; - }, - }; - - // Manifest V2 uses Background Pages which requires a html page. - mainConfig.plugins.push( - new HtmlWebpackPlugin({ - template: "./src/platform/background.html", - filename: "background.html", - chunks: ["vendor", "background"], - }), - ); - - // Manifest V2 background pages can be run through the regular build pipeline. - // Since it's a standard webpage. - mainConfig.entry.background = "./src/platform/background.ts"; - mainConfig.entry["content/fido2-page-script-delay-append-mv2"] = - "./src/autofill/fido2/content/fido2-page-script-delay-append.mv2.ts"; - - configs.push(mainConfig); -} else { - // Firefox does not use the offscreen API - if (browser !== "firefox") { - mainConfig.entry["offscreen-document/offscreen-document"] = - "./src/platform/offscreen-document/offscreen-document.ts"; - - mainConfig.plugins.push( - new HtmlWebpackPlugin({ - template: "./src/platform/offscreen-document/index.html", - filename: "offscreen-document/index.html", - chunks: ["offscreen-document/offscreen-document"], - }), - ); - } - - const target = browser === "firefox" ? "web" : "webworker"; - - /** - * @type {import("webpack").Configuration} - */ - const backgroundConfig = { - name: "background", - mode: ENV, - devtool: false, + background: { entry: "./src/platform/background.ts", - target: target, - output: { - filename: "background.js", - path: path.resolve(__dirname, "build"), - }, - module: { - rules: [ - { - test: /\.tsx?$/, - loader: "ts-loader", - }, - ], - }, - cache: - ENV !== "development" - ? false - : { - type: "filesystem", - name: "background-cache", - cacheDirectory: path.resolve( - __dirname, - "../../node_modules/.cache/webpack-browser-background", - ), - buildDependencies: { - config: [__filename], - }, - }, - snapshot: { - unmanagedPaths: [path.resolve(__dirname, "../../node_modules/@bitwarden/")], - }, - experiments: { - asyncWebAssembly: true, - }, - resolve: { - extensions: [".ts", ".js"], - symlinks: false, - modules: [path.resolve("../../node_modules")], - plugins: [new TsconfigPathsPlugin()], - fallback: { - fs: false, - path: require.resolve("path-browserify"), - }, - cache: true, - }, - dependencies: ["main"], - plugins: [...requiredPlugins, new AngularCheckPlugin()], - }; - - // Safari's desktop build process requires a background.html and vendor.js file to exist - // within the root of the extension. This is a workaround to allow us to build Safari - // for manifest v2 and v3 without modifying the desktop project structure. - if (browser === "safari") { - backgroundConfig.plugins.push( - new CopyWebpackPlugin({ - patterns: [ - { from: "./src/safari/mv3/fake-background.html", to: "background.html" }, - { from: "./src/safari/mv3/fake-vendor.js", to: "vendor.js" }, - ], - }), - ); - } - - configs.push(mainConfig); - configs.push(backgroundConfig); -} - -module.exports = configs; + }, + tsConfig: "tsconfig.json", +}); diff --git a/bitwarden_license/bit-browser/tsconfig.json b/bitwarden_license/bit-browser/tsconfig.json index 15be9b717fd..c3420e280b7 100644 --- a/bitwarden_license/bit-browser/tsconfig.json +++ b/bitwarden_license/bit-browser/tsconfig.json @@ -1,9 +1,19 @@ { "extends": "../../apps/browser/tsconfig", - "files": [], "include": [ "src", + "../../apps/browser/src/**/*.d.ts", + + "../../apps/browser/src/autofill/content/*.ts", + "../../apps/browser/src/autofill/fido2/content/*.ts", + "../../apps/browser/src/autofill/notification/bar.ts", + "../../apps/browser/src/autofill/overlay/inline-menu/**/*.ts", + "../../apps/browser/src/platform/ipc/content/*.ts", + "../../apps/browser/src/platform/offscreen-document/offscreen-document.ts", + "../../apps/browser/src/popup/polyfills.ts", + "../../apps/browser/src/vault/content/*.ts", + "../../libs/common/src/autofill/constants", "../../libs/common/custom-matchers.d.ts" ] diff --git a/bitwarden_license/bit-browser/webpack.config.js b/bitwarden_license/bit-browser/webpack.config.js index aa3270c2e29..74c12d19d6d 100644 --- a/bitwarden_license/bit-browser/webpack.config.js +++ b/bitwarden_license/bit-browser/webpack.config.js @@ -1,17 +1,12 @@ -const { AngularWebpackPlugin } = require("@ngtools/webpack"); +const { buildConfig } = require("../../apps/browser/webpack.base"); -const webpackConfig = require("../../apps/browser/webpack.config"); - -const mainConfig = webpackConfig[0]; -const backgroundConfig = webpackConfig[1]; - -mainConfig.entry["app/main"] = "../../bitwarden_license/bit-browser/src/popup/main.ts"; -mainConfig.plugins[mainConfig.plugins.length - 1] = new AngularWebpackPlugin({ - tsconfig: "../../bitwarden_license/bit-browser/tsconfig.json", - entryModule: "bitwarden_license/bit-browser/src/popup/app.module#AppModule", - sourceMap: true, +module.exports = buildConfig({ + popup: { + entry: "../../bitwarden_license/bit-browser/src/popup/main.ts", + entryModule: "../../bitwarden_license/bit-browser/src/popup/app.module#AppModule", + }, + background: { + entry: "../../bitwarden_license/bit-browser/src/platform/background.ts", + }, + tsConfig: "../../bitwarden_license/bit-browser/tsconfig.json", }); - -backgroundConfig.entry = "./src/platform/background.ts"; - -module.exports = webpackConfig;