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

liferay-npm-bundler-preset-vue

library1.8.0jsnpmunverified

The `liferay-npm-bundler-preset-vue` package provides a specialized configuration preset for the `liferay-npm-bundler`, specifically tailored for Vue.js projects integrated within the Liferay DXP ecosystem. Currently at version 1.8.0, this package is typically released as part of the broader `liferay-npm-build-tools` suite, aligning its updates with Liferay DXP's release cycle rather than an independent cadence. Its core function is to streamline the build process for Vue.js applications by including pre-configured Babel presets, such as `babel-preset-liferay-standard`, and essential Liferay NPM Bundler plugins like `liferay-npm-bundler-plugin-replace-browser-modules`. This ensures proper transpilation, module resolution, and compatibility with Liferay's runtime environment, differentiating it from general-purpose Vue build tools by offering Liferay-specific optimizations and required polyfills for portlet and widget development.

web-framework devops

npm install liferay-npm-bundler-preset-vue

package ↗

INSTALL

IMPORT

SIG · LIFERAY-NPM-BUNDLE

liferay-npm-bundler-preset-vue

web-frameworkjavascriptv1.8.0

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

This demonstrates how to enable the Vue.js preset within your `.npmbundlerrc` configuration file for the Liferay NPM Bundler.

{ "preset": "liferay-npm-bundler-preset-vue" }

Debug

Known issues

breakingMajor version updates to `liferay-npm-bundler` or `liferay-npm-build-tools` may introduce breaking changes requiring updates to the preset or its underlying dependencies. Always check the release notes for the `liferay-npm-build-tools` monorepo.

fix

Consult Liferay's official documentation for `liferay-npm-build-tools` and `liferay-npm-bundler` for compatibility matrices and migration guides when upgrading Liferay DXP or build tools versions.

affects: >=1.x

gotchaThis preset is designed exclusively for Vue.js projects targeting the Liferay DXP platform. Using it outside of the `liferay-npm-bundler` context or for generic Vue.js projects not deployed to Liferay DXP is not supported and will likely cause build issues or unnecessary overhead.

fix

Ensure your project is a Liferay DXP portlet or widget and is configured to use `liferay-npm-bundler` correctly. For non-Liferay projects, use standard Vue CLI or Vite configurations.

affects: >=1.0.0

gotchaConflicts can arise if custom Babel configurations in your project (`.babelrc`, `babel.config.js`) overlap or contradict the presets included by `liferay-npm-bundler-preset-vue` and `babel-preset-liferay-standard`. This can lead to unexpected transpilation errors or incorrect module outputs.

fix

Review your project's Babel configuration. Prioritize using the Liferay presets and only add custom configurations for specific, non-conflicting transformations. Test build outputs thoroughly.

affects: >=1.0.0

Errors

Common errors & fixes

Error: Cannot find module 'liferay-npm-bundler-preset-vue' from '...'

The package `liferay-npm-bundler-preset-vue` is not installed or the `preset` value in `.npmbundlerrc` is misspelled.

fix

Run `npm install --save-dev liferay-npm-bundler-preset-vue` or `yarn add -D liferay-npm-bundler-preset-vue` to install the package. Double-check the spelling in your `.npmbundlerrc` file.

SyntaxError: Unexpected token 'export' (or other ES module error) in bundled output

Indicates an issue with Babel transpilation, often due to an incorrect or missing `babel-preset-liferay-standard` configuration or conflicts with other Babel plugins, failing to correctly convert ES modules to CommonJS for Liferay's runtime.

fix

Verify that `liferay-npm-bundler-preset-vue` is correctly loaded in `.npmbundlerrc`. Ensure there are no conflicting Babel configurations that might disable or override the Liferay standard preset. Upgrade to the latest compatible versions of Liferay build tools.

Upgrade

Version history

1.8.0latest on npm

Audit

Dependencies

liferay-npm-bundlerrequiredThis package is a preset for the liferay-npm-bundler and requires it to function.

babel-preset-liferay-standardrequiredIncluded as a core Babel preset for standard Liferay JavaScript compilation.

liferay-npm-bundler-plugin-replace-browser-modulesrequiredIncluded as a bundler plugin for Liferay-specific module replacement and compatibility.

Agent activity

4 hits · last 30 days

node

Resources

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