Registry / web-framework / pug-react-compiler

pug-react-compiler

library1.1.0jsnpmunverified

A compiler that converts Pug (formerly Jade) templates into React components by parsing Pug AST into intermediate JavaScript, converting to SpiderMonkey AST via Esprima, and producing React-compatible render functions. Current stable version is 1.1.0, with low release cadence (last update 2015). Key differentiators: supports `require` hoisting for external components, handles conditionals and iteration, but lacks filters, mixins, and cases. Not intended for production use; includes a CLI tool and works with CommonJS bundlers.

web-framework

npm install pug-react-compiler

github ↗package ↗

INSTALL

IMPORT

SIG · PUG-REACT-COMPILER

pug-react-compiler

web-frameworkjavascriptv1.1.0

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

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

compileClient

✓ import { compileClient } from 'pug-react-compiler'

✗ var compileClient = require('pug-react-compiler').compileClient;

ESM and CJS both supported; compileClient returns compiled code as a string.

compile

✓ import { compile } from 'pug-react-compiler'

✗ const pugReact = require('pug-react-compiler'); const fn = pugReact.compile('...');

compile returns a function; no default export.

default (mocked)

✓ import pugReact from 'pug-react-compiler'

✗ const pugReact = require('pug-react-compiler');

No default export; this import will be undefined.

Shows basic usage: compile Pug to a React component and to a code string.

const React = require('react'); const { compile, compileClient } = require('pug-react-compiler'); // Compile to a render function const fn = compile('p Hello, world!'); const Component = React.createClass({ render: fn }); const markup = React.renderToStaticMarkup(React.createElement(Component)); console.log(markup); // Compile to code string const code = compileClient('div#root'); console.log(code);

pug-react --version

Debug

Known issues

deprecatedPackage is unmaintained and relies on outdated React versions (pre-0.14).

fix

Migrate to a modern alternative like @emotion/styled or JSX with Babel.

affects: <1.2

gotchaFilters, mixins, and cases are NOT implemented; using them will cause errors or silent failures.

fix

Avoid these Pug features or process them manually before compilation.

affects: >=1.0

gotchaMultiple root nodes: only the last statement is returned; previous ones are discarded.

fix

Wrap multiple elements in a single parent element.

affects: >=1.0

gotchaUsing Array.prototype.forEach in templates outputs nothing; use Pug's `each` block instead.

fix

Prefer pug's `each` syntax over JavaScript for loops.

affects: >=1.0

gotchaNaked text nodes without a parent are auto-wrapped in a <span>.

fix

Wrap text nodes explicitly in a parent element to control output.

affects: >=1.0

Errors

Common errors & fixes

React is not defined

The package generates code that references React.DOM but does not automatically require React.

fix

Ensure React is available globally or require it before using compiled components.

Cannot find module 'pug'

Required dependency pug must be installed explicitly; the package does not bundle it.

fix

Run npm install pug --save alongside pug-react-compiler.

TypeError: pugReact.compile is not a function

Using default import when only named exports exist.

fix

Use named imports: import { compile } from 'pug-react-compiler'

Upgrade

Version history

1.1.0latest on npm

Audit

Dependencies

pugrequiredParses Pug input into AST for compilation

esprimarequiredParses intermediate JavaScript into SpiderMonkey AST

uglify-jsrequiredTransforms and minifies the generated AST

reactoptionalProvides React.DOM and render methods for component generation

Agent activity

4 hits · last 30 days

node

Resources

githubhttps://github.com/erikwoo/pug-react-compiler ↗

packagehttps://www.npmjs.com/package/pug-react-compiler ↗