{"id":20820,"library":"webpack-rtl-plugin","title":"webpack-rtl-plugin","description":"Webpack plugin that generates an additional right-to-left (RTL) CSS bundle alongside the original LTR stylesheet using mini-css-extract-plugin. Current stable version 2.0.0, with irregular releases. Under the hood it uses rtlcss for CSS transformation. Key differentiator: it is a dedicated Webpack plugin, unlike standalone rtlcss or postcss-rtl which require separate loaders or post-processing. It supports content hashing in filenames, diff-only output, minification via cssnano, and custom rtlcss options/plugins.","status":"active","version":"2.0.0","language":"javascript","source_language":"en","source_url":"https://github.com/romainberger/webpack-rtl-plugin","tags":["javascript","webpack","css","rtl"],"install":[{"cmd":"npm install webpack-rtl-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add webpack-rtl-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add webpack-rtl-plugin","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Required peer dependency; plugin creates the initial CSS bundle that webpack-rtl-plugin processes into an RTL version","package":"mini-css-extract-plugin","optional":false},{"reason":"Core dependency used by the plugin to transform CSS from LTR to RTL","package":"rtlcss","optional":false}],"imports":[{"note":"The package does not ship TypeScript definitions and uses CommonJS; named import via ES is unsupported. Use require.","wrong":"import WebpackRTLPlugin from 'webpack-rtl-plugin'","symbol":"WebpackRTLPlugin","correct":"const WebpackRTLPlugin = require('webpack-rtl-plugin')"},{"note":"Some versions mistakenly exported default. Check package; usually require('webpack-rtl-plugin') works directly.","wrong":"const WebpackRTLPlugin = require('webpack-rtl-plugin')","symbol":"WebpackRTLPlugin","correct":"const WebpackRTLPlugin = require('webpack-rtl-plugin').default"},{"note":"If using TypeScript with esModuleInterop or bundlers that support CJS interop, this may work but is not officially supported.","wrong":"","symbol":"WebpackRTLPlugin","correct":"import WebpackRTLPlugin from 'webpack-rtl-plugin'"}],"quickstart":{"code":"const MiniCssExtractPlugin = require('mini-css-extract-plugin');\nconst WebpackRTLPlugin = require('webpack-rtl-plugin');\nconst path = require('path');\n\nmodule.exports = {\n  entry: './src/index.js',\n  output: {\n    path: path.resolve(__dirname, 'dist'),\n    filename: 'bundle.js',\n  },\n  module: {\n    rules: [\n      {\n        test: /\\.css$/,\n        use: [\n          MiniCssExtractPlugin.loader,\n          'css-loader'\n        ]\n      }\n    ]\n  },\n  plugins: [\n    new MiniCssExtractPlugin({ filename: 'style.css' }),\n    new WebpackRTLPlugin({\n      filename: 'style.rtl.css',\n      minify: true\n    })\n  ]\n};","lang":"javascript","description":"Shows basic usage: add plugin after MiniCssExtractPlugin, output LTR and RTL CSS bundles."},"warnings":[{"fix":"Add mini-css-extract-plugin to your devDependencies and instantiate it before WebpackRTLPlugin.","message":"Plugin does not work without mini-css-extract-plugin; ensure it is installed and configured.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Update to version 2.0.0 and use bracket placeholders like '[name].rtl.css'.","message":"The 'filename' option has changed between versions; earlier versions used a different placeholder syntax.","severity":"deprecated","affected_versions":"<2.0.0"},{"fix":"Always specify the 'filename' option with a pattern that includes the original extension, e.g., '[name].rtl.css'.","message":"The default filename overrides the original CSS file name if not set explicitly; you may get 'style.rtl.css' instead of expected pattern.","severity":"gotcha","affected_versions":">=1.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 webpack-rtl-plugin --save-dev' and use 'const WebpackRTLPlugin = require('webpack-rtl-plugin');'","cause":"Package not installed or required incorrectly.","error":"Error: Cannot find module 'webpack-rtl-plugin'"},{"fix":"Use CommonJS require: const WebpackRTLPlugin = require('webpack-rtl-plugin');","cause":"Importing as default export incorrectly (e.g., import WebpackRTLPlugin from 'webpack-rtl-plugin') when using ESM.","error":"TypeError: WebpackRTLPlugin is not a constructor"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}