Registry / web-framework / subapp-pbundle

subapp-pbundle

library1.1.1jsnpmunverified

This module, `subapp-pbundle`, version 1.1.1, serves as an integration layer for Electrode subapps utilizing the Preact UI framework and `redux-bundler` for state management. It essentially re-exports core functionalities from `subapp-web` and adapts them for Preact, including re-exporting Preact's `h`, `Component`, and `render` APIs for convenience. A key differentiator is its `reduxBundlerLoadSubApp` API, specifically designed for loading `redux-bundler`-based subapps within the Electrode ecosystem. The package is primarily distributed as ES modules, advocating for modern bundling practices like tree-shaking. While it provides server-side rendering (SSR) context support via `AppContext`, further support for advanced features like React Router and Preact Suspense remains "TBD," suggesting a slower release cadence or a maintenance-focused development cycle since its initial release around 2016 by WalmartLabs.

web-framework

npm install subapp-pbundle

package ↗

INSTALL

IMPORT

SIG · SUBAPP-PBUNDLE

subapp-pbundle

web-frameworkjavascriptv1.1.1

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.

h, reduxBundlerLoadSubApp

✓ import { h, reduxBundlerLoadSubApp } from 'subapp-pbundle';

✗ const { h, reduxBundlerLoadSubApp } = require('subapp-pbundle');

The package is ESM-only; CommonJS require() will not work for named exports.

AppContext

✓ import { AppContext } from 'subapp-pbundle';

✗ const { AppContext } = require('subapp-pbundle');

AppContext is a Preact Context object for SSR data, and requires ES Module import.

Component, render

✓ import { Component, render } from 'subapp-pbundle';

✗ import { Component, render } from 'preact';

For convenience, core Preact APIs 'Component' and 'render' are re-exported from 'subapp-pbundle'.

Demonstrates defining an Electrode subapp with Preact, using `reduxBundlerLoadSubApp` and accessing SSR context via `AppContext`.

/** @jsx h */ import { h, reduxBundlerLoadSubApp, AppContext } from "subapp-pbundle"; import { useState } from 'preact/hooks'; // Assuming preact/hooks is also available const MyPreactComponent = () => { const [count, setCount] = useState(0); return ( <AppContext.Consumer> {({ isSsr, ssr, subApp }) => ( <div> <h1>My Electrode Subapp</h1> <p>Current count: {count}</p> <button onClick={() => setCount(count + 1)}>Increment</button> <p>Running on SSR: {`${Boolean(isSsr)}`}</p> {isSsr && ssr && ssr.request && <p>Request URL: {ssr.request.url ?? 'N/A'}</p>} <p>Subapp name: {subApp?.name ?? 'Unknown'}</p> </div> )} </AppContext.Consumer> ); }; export default reduxBundlerLoadSubApp({ name: "MyComponent", Component: MyPreactComponent });

Debug

Known issues

breakingThis package is distributed as ES Modules (ESM) only. Attempting to use CommonJS `require()` syntax will result in errors.

fix

Ensure your project uses ES module syntax (`import`/`export`) and is configured for ESM. Modern bundlers like Webpack 4+ or Rollup handle this automatically, but legacy environments might require specific configuration.

affects: >=1.0.0

gotcha`preact` and `preact-render-to-string` are declared as peer dependencies and must be installed explicitly in your project's `package.json`.

fix

Install `preact` and `preact-render-to-string` using your package manager: `npm install preact preact-render-to-string` or `yarn add preact preact-render-to-string`.

affects: >=1.0.0

gotchaThe package assumes the presence of polyfills for modern ES6+ APIs (e.g., `Promise`, Array methods) in the runtime environment. These are not bundled with `subapp-pbundle`.

fix

Integrate a polyfill service like `polyfill.io` or include necessary polyfills (e.g., using `core-js` with Babel) in your application's build process to ensure broad browser compatibility.

affects: >=1.0.0

Errors

Common errors & fixes

SyntaxError: Cannot use import statement outside a module

Attempting to use `import` or `export` syntax in a CommonJS (`.js` without `"type": "module"` in `package.json` or a `.cjs` file) Node.js environment.

fix

Rename your file to `.mjs`, add `"type": "module"` to your `package.json`, or configure your build system (e.g., Webpack) to correctly handle ESM modules.

Error: Cannot find module 'preact' or 'Error: Cannot find module 'preact-render-to-string''

The peer dependencies `preact` or `preact-render-to-string` are not installed in the consuming project's `node_modules`.

fix

Run `npm install preact preact-render-to-string` or `yarn add preact preact-render-to-string` in your project's root directory.

ReferenceError: Promise is not defined

The runtime environment (e.g., older browser, specific Node.js version) is missing global ES6+ APIs like `Promise` or array iteration methods.

fix

Include a polyfill for ES6+ features in your application. Common solutions include `core-js` or a service like `polyfill.io`.

Upgrade

Version history

1.1.1latest on npm

Audit

Dependencies

preactrequiredRequired as a peer dependency for the Preact UI framework.

preact-render-to-stringrequiredRequired as a peer dependency for server-side rendering with Preact.

@babel/runtimerequiredProvides Babel helper functions for transpiled ES5 code.

Agent activity

4 hits · last 30 days

node

Resources

packagehttps://www.npmjs.com/package/subapp-pbundle ↗