Registry / web-framework / lwc-webpack-plugin

lwc-webpack-plugin

library3.1.0jsnpmunverified

Webpack plugin for building Lightning Web Components (LWC) in any web framework project. Current stable version is 3.1.0, released on a monthly cadence. It allows you to use LWC within any web framework project that uses Webpack. Key differentiators: Provides seamless integration of LWC components with Webpack, supports TypeScript through additional Babel configuration, and allows custom module resolution via lwc.config.json or package.json. Compared to alternatives like raw LWC compiler, it automates component compilation and asset handling within the Webpack bundling process.

web-framework devops http-networking

npm install lwc-webpack-plugin

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · LWC-WEBPACK-PLUGIN

lwc-webpack-plugin

web-frameworkjavascriptv3.1.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

LwcWebpackPlugin

✓ const LwcWebpackPlugin = require('lwc-webpack-plugin')

✗ import LwcWebpackPlugin from 'lwc-webpack-plugin'

CommonJS is the primary import style; ESM import may not work due to lack of default export.

LwcWebpackPlugin

✓ import LwcWebpackPlugin from 'lwc-webpack-plugin'

✗ import { LwcWebpackPlugin } from 'lwc-webpack-plugin'

Named import is incorrect; it's a default export only.

LwcWebpackPlugin

✓ const plugin = new LwcWebpackPlugin()

✗ const plugin = new LwcWebpackPlugin({...})

Constructor accepts optional options object; no arguments needed for default config.

Basic setup: require the plugin and add it to webpack plugins array with default module resolution from lwc.config.json.

const LwcWebpackPlugin = require('lwc-webpack-plugin') module.exports = { plugins: [new LwcWebpackPlugin()] }

Debug

Known issues

breakingIn v3.0.0, lwc and @lwc/module-resolver became peer dependencies.

fix

Install peer deps: npm install --save-dev lwc@^2 @lwc/module-resolver@^2

affects: >=3.0.0

deprecatedstylesheetConfig option is deprecated since lwc v3.1.3 and results in a NOOP.

fix

Remove stylesheetConfig from plugin options.

affects: >=3.0.0

gotchaIf you use lwc v3 packages, the @lwc/synthetic-shadow alias may break webpack without proper configuration.

fix

Ensure you have the correct alias configuration in webpack for @lwc/synthetic-shadow.

affects: >=3.0.0

gotchaMissing CSS imports for non-implicit CSS files may cause warnings or errors.

fix

Ensure all imported CSS files exist and are correctly referenced.

affects: >=3.0.3

Errors

Common errors & fixes

Error: Cannot find module 'lwc'

Missing peer dependency lwc.

fix

npm install --save-dev lwc@^2

Error: Cannot find module '@lwc/module-resolver'

Missing peer dependency @lwc/module-resolver.

fix

npm install --save-dev @lwc/module-resolver@^2

Module not found: Error: Can't resolve '@lwc/synthetic-shadow'

Alias not configured for @lwc/synthetic-shadow in webpack.

fix

Add resolve.alias: { '@lwc/synthetic-shadow': require.resolve('@lwc/synthetic-shadow') } to webpack config.

TypeError: LwcWebpackPlugin is not a constructor

Using named import instead of default import.

fix

Use const LwcWebpackPlugin = require('lwc-webpack-plugin') or import LwcWebpackPlugin from 'lwc-webpack-plugin'

Upgrade

Version history

3.1.0latest on npm

Audit

Dependencies

@lwc/module-resolverrequiredPeer dependency for module resolution of LWC components

lwcrequiredPeer dependency providing the LWC compiler and runtime

Agent activity

3 hits · last 30 days

node

Amazon

Resources

githubhttps://github.com/salesforce/lwc-webpack-plugin ↗

packagehttps://www.npmjs.com/package/lwc-webpack-plugin ↗

homepagehttps://lwc.dev ↗