Builds an Obsidian plugin with webpack: a webpack plugin that gives a build the same main.js + styles.css + manifest.json layout the esbuild builder produces, deploys a watch build into the vault, and fills in only the options the consumer’s own webpack.config leaves unset.
webpack is an optional peer dependency. This module only imports its types and reaches webpack’s classes through compiler.webpack, so a plugin built with esbuild installs nothing extra.
| Class |
Description |
| ObsidianPluginWebpackPlugin |
A webpack plugin that builds an Obsidian plugin. What it does, each only when the consumer’s config has not said otherwise: - entry is src/main.ts, and mode follows the build mode. - The output is one CommonJS (commonjs2) main.js in dist/build (dist/dev in development), with no async chunks, so a dynamic import cannot become a sibling file. - target is node, which is what Obsidian’s renderer runs, so Node builtins resolve, while the export conditions are the browser’s (browser, webpack, the mode, module, import, require, and never node), so packages hand over their browser builds, as on mobile they must. - devtool is an inline source map in development only. And always: Obsidian’s own modules (obsidian, electron, CodeMirror, Lezer) and the Node builtins are external beside the consumer’s own externals, the generated-file banner heads main.js, license comments a minimizer extracted into main.js.LICENSE.txt (which no Obsidian release ships) are put back into main.js, the output folder is emptied before the first build, every emitted CSS file ends up in styles.css, manifest.json (and in development .hotreload) is copied beside it, and a development build is deployed into the vault named by OBSIDIAN_CONFIG_FOLDER. TypeScript stays the consumer’s choice of loader, as it would be without this plugin. The build features (ObsidianPluginFeatureOptions) are the plugin’s: - framework: 'react' | 'preact' needs nothing here: the TypeScript loader reads the automatic JSX runtime from the toolkit’s tsconfig preset, and webpack’s mode defines process.env.NODE_ENV. - framework: 'solid' | 'svelte' adds rules that compile the components with the toolkit’s shared transforms, and 'vue' applies unplugin-vue and defines Vue’s feature flags. - styles adds the one rule every stylesheet goes through (PostCSS and Tailwind, then css-loader, scoping *.module.css only with cssModules, then mini-css-extract-plugin), and applies mini-css-extract-plugin unless the config already does; leave your own .css rule out. styles: \{\} compiles plain CSS. - wasm imports a .wasm module as its bytes. |
| Function |
Description |
| getWebpackBuildMode |
Decides the build mode of a webpack build from the consumer’s config: development when webpack watches or its mode is development, production otherwise. |
| getWebpackFeatureRules |
Builds the module rules the build features add, each running the toolkit’s own loader: Solid’s JSX before the project’s TypeScript loader, Svelte components and modules, .wasm modules as JavaScript, and with styles the stylesheet rule. |
| obsidianPluginWebpackExternals |
Tells webpack’s function form of externals to leave Obsidian’s modules and the Node builtins to require(). |