Registry / web-framework / liferay-npm-bundler-preset-angular

liferay-npm-bundler-preset-angular

library1.8.0jsnpmunverified

The `liferay-npm-bundler-preset-angular` package provides a specialized configuration preset for `liferay-npm-bundler`, designed to streamline the bundling and optimization of Angular projects for deployment within the Liferay Portal environment. It consolidates a set of Babel presets (specifically `babel-preset-liferay-standard`) and Liferay NPM Bundler plugins (like `liferay-npm-bundler-plugin-replace-browser-modules` and `liferay-npm-bundler-plugin-inject-angular-dependencies`) into a single, easy-to-use configuration. This ensures Angular applications are correctly processed for Liferay's module federation and runtime requirements. The current stable version is 1.8.0, and its release cadence is typically tied to the broader `liferay-npm-build-tools` ecosystem rather than an independent schedule. Its key differentiator is simplifying complex build setups for Angular developers working with Liferay by providing a pre-baked, opinionated solution.

web-framework

npm install liferay-npm-bundler-preset-angular

package ↗homepage ↗

INSTALL

IMPORT

SIG · LIFERAY-NPM-BUNDLE

liferay-npm-bundler-preset-angular

web-frameworkjavascriptv1.8.0

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Shows how to configure your project's `.npmbundlerrc` file to use the Angular preset, including typical output and global settings.

{ "preset": "liferay-npm-bundler-preset-angular", "output": { "name": "angular-portlet", "globals": { "@angular/core": "Liferay.Angular.core", "@angular/common": "Liferay.Angular.common" } }, "plugins": [ // Any additional liferay-npm-bundler plugins specific to your project // For example, if you need to process other file types or modify behavior // {"name": "liferay-npm-bundler-plugin-css"} ] }

Debug

Known issues

breakingMajor version upgrades of `liferay-npm-bundler` or the underlying `liferay-npm-build-tools` can introduce breaking changes to the preset's internal configuration or expected behavior. Always review the release notes.

fix

Consult the official Liferay documentation and `liferay-npm-build-tools` release notes for compatibility matrices and migration guides before upgrading.

affects: >=1.0.0

gotchaCombining this preset with custom Babel configurations (e.g., in `babel.config.js` or `package.json`) can lead to conflicts, as the preset already includes `babel-preset-liferay-standard`.

fix

Ensure that custom Babel configurations do not duplicate or conflict with presets and plugins already included by `babel-preset-liferay-standard`. Prefer extending the preset's configuration rather than defining entirely separate ones.

affects: >=1.0.0

gotchaThe preset expects Angular's runtime dependencies to be available as globals within the Liferay environment. Incorrect global mapping can lead to runtime errors.

fix

Verify that your `.npmbundlerrc` `output.globals` section correctly maps Angular packages (e.g., `@angular/core`) to the Liferay-provided global variables as shown in the quickstart example.

affects: >=1.0.0

Errors

Common errors & fixes

Error: Cannot find module 'liferay-npm-bundler-preset-angular' from '.../.npmbundlerrc'

The `liferay-npm-bundler-preset-angular` package is not installed or is not resolvable from the project's node_modules.

fix

Run `npm install --save-dev liferay-npm-bundler-preset-angular` in your project's root directory.

TypeError: bundler.define.globals is not a function (or similar runtime error related to global variables)

The `output.globals` configuration in `.npmbundlerrc` is incorrect, or the Liferay environment is not exposing the expected Angular globals at runtime.

fix

Double-check the `output.globals` section in your `.npmbundlerrc` against the Liferay documentation for the correct Angular global variable names. Ensure the Liferay portal itself is configured to provide these globals.

Module parse failed: Unexpected token (X:Y) You may need an appropriate loader to handle this file type.

A file type (e.g., a specific TypeScript feature or ESNext syntax) is not being correctly transpiled by the Babel configuration included in the preset, or a required plugin/preset is missing.

fix

While the preset includes standard Babel support, complex or bleeding-edge syntax might require explicit additional Babel configuration. Consider adding custom Babel plugins/presets to your `.npmbundlerrc`'s `plugins` array (if supported by `liferay-npm-bundler`) or configuring Babel directly if the bundler allows it.

Upgrade

Version history

1.8.0latest on npm

Audit

Dependencies

liferay-npm-bundlerrequiredThis preset configures the liferay-npm-bundler; it's a core dev dependency.

babel-preset-liferay-standardrequiredIncluded internally by this preset for standard Babel transformations in Liferay projects.

liferay-npm-bundler-plugin-replace-browser-modulesrequiredIncluded internally by this preset to handle browser-specific module replacements for Liferay compatibility.

liferay-npm-bundler-plugin-inject-angular-dependenciesrequiredIncluded internally by this preset to correctly inject Angular's runtime dependencies into the bundled output for Liferay.

Agent activity

4 hits · last 30 days

node

Resources

packagehttps://www.npmjs.com/package/liferay-npm-bundler-preset-angular ↗

homepagehttps://liferay.com ↗