1. Union Component
  2. Installation
  3. Introduction
  4. Union
  5. Widget Descriptors
  6. Common Data Descriptors
  7. withWidgetContext()
  8. Utilities
  9. FAQ
  1. Scripts
  2. Installation
  3. Introduction
  4. Usage
  5. Monorepo
  6. CLI
  7. Configuration
  8. Testing
  9. Recipes
  10. Polyfilling
  1. Boilerplates
  2. Basic
  3. Monorepo
  4. Liferay
  5. SSR

Liferay

This project shows how both react-union and react-union-scripts can be used within Liferay portal platform.

We target the version 7.2 and above. For the Liferay 7.0 and 7.1 versions see the older versions of the boilerplates.

Running the example

git clone https://github.com/lundegaard/react-union.git

cd react-union/boilerplates/react-union-boilerplate-liferay-basic

yarn && yarn start

Usage

1. Setup union.config.js

By default union.config.js is configured to:

  • With yarn start you run development server over localhost:3300.
  • There is one SampleApp application.

2. Mock Liferay output and run development server

  • The HTML template used while running DEV server can be found in public/SampleApp/index.ejs file.
  • Run yarn start to start DEV server.

3. Create Liferay portlets that render widget descriptors

4. Run proxy server over locally running Liferay instance

  • Run yarn start:proxy to start proxy server with Hot Module Replacement available
  • Configure proxy in union.config.js. By default the target is localhost:8080

5. Create production build

  • Run yarn build.

6. Deploy to Liferay

Resulting jar can be found in the dist folder as it is produced by liferay-npm-bundler. We do some preprocessing to make the filenames of more deterministic in the bundle script. This way we can make HMR in DEV mode work.

7. Build and deploy hero-portlet module

Portlets are a preferred way how to place union apps within Liferay pages.

  • Move to /hero-portlet subfolder.
  • Run ./gradlew build.
  • Deploy manually or using blade tools

Using the Boilerplate

Make sure you have Yarn v1.3.1 or higher and Node v8 or higher.

Starting develop server

yarn start

Starting proxy over Liferay

yarn start:proxy

Production build

Bundle to build folder

yarn build

Production build with AMD loader specific configuration

Bundle to build folder and creates AMD loader specific loader subfolder which is then used by gradle build script in liferay-amd-loader module

yarn build:liferay

Running unit tests in watch mode

yarn test

Analyze build

yarn build --release --analyze