Registry / devops / react-figma-webpack-config

react-figma-webpack-config

library0.0.7jsnpmunverified

Webpack configuration preset for React Figma plugin development. Version 0.0.7 (last release, no recent updates). Provides a preconfigured webpack setup optimized for Figma plugin projects using React, TypeScript, and SVG. Requires manual installation of peer dependencies (html-webpack-plugin, html-webpack-inline-source-plugin, svg-inline-loader, ts-loader, webpack, webpack-merge). Exports a function that returns a webpack config object, with optional overrides for entry points and other settings. Lightweight alternative to custom webpack setup for Figma plugins, but limited documentation and low activity.

devops web-framework

npm install react-figma-webpack-config

package ↗

INSTALL

IMPORT

SIG · REACT-FIGMA-WEBPAC

react-figma-webpack-config

devopsjavascriptv0.0.7

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.

configure

✓ const configure = require('react-figma-webpack-config');

✗ import configure from 'react-figma-webpack-config';

Package uses CommonJS, not ESM. ES import will fail.

configure (with options)

✓ configure({ entry: { ui: './src/ui.js', code: './src/code.js' } })

✗ configure({ entry: './src/ui.js' })

Entry must be an object with 'ui' and 'code' keys for Figma plugin.

default config

✓ configure()

✗ new configure()

configure is a function, not a class.

Creates a webpack configuration for a Figma plugin with React UI and TypeScript code entry points.

// webpack.config.js var configure = require('react-figma-webpack-config'); module.exports = configure({ entry: { ui: './src/ui.tsx', code: './src/code.ts' }, output: { path: __dirname + '/dist' } });

Debug

Known issues

gotchaPackage requires manual installation of many peer dependencies listed in README.

fix

Install all required packages: npm i html-webpack-inline-source-plugin html-webpack-plugin svg-inline-loader ts-loader webpack webpack-merge -D

affects: >=0.0.1

gotchaEntry must be an object with both 'ui' and 'code' keys, otherwise builds may fail or produce incorrect output.

fix

Set entry as { ui: './path/to/ui', code: './path/to/code' }

affects: >=0.0.1

gotchaThe default configuration may not include necessary Figma-specific settings like 'figma' global variable handling.

fix

Configure ProvidePlugin or define plugin to expose 'figma' global if needed.

affects: >=0.0.1

Errors

Common errors & fixes

Error: Cannot find module 'html-webpack-inline-source-plugin'

Missing peer dependency

fix

npm install html-webpack-inline-source-plugin --save-dev

TypeError: configure is not a function

Using ES import syntax with a CommonJS package

fix

Use require() instead of import: const configure = require('react-figma-webpack-config');

Error: Entry module not found: Error: Can't resolve './src/ui.js'

Entry points defined in configure() do not match actual files

fix

Ensure entry paths are correct and files exist, e.g., configure({ entry: { ui: './src/ui.tsx', code: './src/code.ts' } })

Upgrade

Version history

0.0.7latest on npm

Audit

Dependencies

html-webpack-inline-source-pluginrequiredUsed to inline source maps and assets in HTML for Figma UI

html-webpack-pluginrequiredGenerates HTML file for Figma UI

svg-inline-loaderrequiredInline SVG files as React components

ts-loaderrequiredTypeScript compilation

webpackrequiredCore bundler

webpack-mergerequiredExtend default config with custom options

Agent activity

8 hits · last 30 days

node

Resources

packagehttps://www.npmjs.com/package/react-figma-webpack-config ↗