{"id":20576,"library":"style-ext-html-webpack-plugin","title":"style-ext-html-webpack-plugin","description":"Webpack plugin that converts external CSS links generated by HtmlWebpackPlugin and ExtractTextPlugin or MiniCssExtractPlugin into inline <style> elements in the HTML output. Version 4.1.3 is the final release, supporting Webpack 4.x and HtmlWebpackPlugin 4.x. No longer maintained; does not support Webpack 5. Differentiates from other inlining solutions by specifically targeting CSS extraction patterns.","status":"deprecated","version":"4.1.3","language":"javascript","source_language":"en","source_url":"https://github.com/numical/style-ext-html-webpack-plugin","tags":["javascript","webpack","plugin","html-webpack-plugin","extract-text-webpack-plugin","inline styles","internal styles","style"],"install":[{"cmd":"npm install style-ext-html-webpack-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add style-ext-html-webpack-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add style-ext-html-webpack-plugin","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency for generating HTML with styles","package":"html-webpack-plugin","optional":false},{"reason":"peer dependency, version 4.x required","package":"webpack","optional":false},{"reason":"used to generate CSS assets that are then inlined","package":"mini-css-extract-plugin","optional":true},{"reason":"alternative to mini-css-extract-plugin for older setups","package":"extract-text-webpack-plugin","optional":true}],"imports":[{"note":"This package exports a CommonJS module; ESM import will fail. Use require().","wrong":"import StyleExtHtmlWebpackPlugin from 'style-ext-html-webpack-plugin';","symbol":"styleExtHtmlWebpackPlugin","correct":"const StyleExtHtmlWebpackPlugin = require('style-ext-html-webpack-plugin');"},{"note":"Constructor name is PascalCase; the imported function is the constructor itself.","wrong":"new styleExtHtmlWebpackPlugin({ ...options })","symbol":"constructor","correct":"new StyleExtHtmlWebpackPlugin({ ...options })"},{"note":"Must instantiate the plugin with 'new'; passing the function reference does not work.","wrong":"plugins: [require('style-ext-html-webpack-plugin')]","symbol":"plugin configuration","correct":"plugins: [new StyleExtHtmlWebpackPlugin()]"}],"quickstart":{"code":"const HtmlWebpackPlugin = require('html-webpack-plugin');\nconst MiniCssExtractPlugin = require('mini-css-extract-plugin');\nconst StyleExtHtmlWebpackPlugin = require('style-ext-html-webpack-plugin');\n\nmodule.exports = {\n  module: {\n    rules: [{\n      test: /\\.css$/,\n      use: [MiniCssExtractPlugin.loader, 'css-loader']\n    }]\n  },\n  plugins: [\n    new HtmlWebpackPlugin(),\n    new MiniCssExtractPlugin(),\n    new StyleExtHtmlWebpackPlugin()\n  ]\n};","lang":"javascript","description":"Minimal webpack configuration with HtmlWebpackPlugin, MiniCssExtractPlugin, and StyleExtHtmlWebpackPlugin to inline CSS as <style> tags."},"warnings":[{"fix":"Consider forking or migrating to alternative solutions like html-webpack-inline-style-plugin or custom HtmlWebpackPlugin hooks.","message":"Project is no longer maintained. Does not support Webpack 5. Final version is 4.1.3.","severity":"deprecated","affected_versions":">=4.1.3"},{"fix":"Upgrade to Webpack 4 and HtmlWebpackPlugin 4 if on v3; or downgrade to v3.x of style-ext-html-webpack-plugin for older setups.","message":"v4.x requires Node 6 or higher, Webpack 4.x, and HtmlWebpackPlugin 4.x.","severity":"breaking","affected_versions":">=4.0.0 <5.0.0"},{"fix":"Do not use this plugin if you want external CSS files; only use for inline styles.","message":"CSS files using MiniCssExtractPlugin are inlined as <style> tags even if you wanted external links.","severity":"gotcha","affected_versions":">=4.0.0"},{"fix":"Test your setup thoroughly; consider using ExtractTextPlugin instead if HMR is required.","message":"The plugin may not work with multiple entry points or Hot Module Replacement when using MiniCssExtractPlugin.","severity":"gotcha","affected_versions":">=4.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Run 'npm install style-ext-html-webpack-plugin --save-dev' in your project directory.","cause":"Package not installed or installed globally without local install.","error":"Error: Cannot find module 'style-ext-html-webpack-plugin'"},{"fix":"Use 'const StyleExtHtmlWebpackPlugin = require('style-ext-html-webpack-plugin');' and instantiate with 'new'.","cause":"Using import instead of require or forgetting 'new' keyword.","error":"TypeError: StyleExtHtmlWebpackPlugin is not a constructor"},{"fix":"Ensure you have Webpack 4.x and HtmlWebpackPlugin 4.x installed; check peer dependencies.","cause":"Incompatible version of Webpack or HtmlWebpackPlugin.","error":"Error: HookWebpackError: Plugin could not be instantiated"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}