Creating Multi-Module Portlet Project
It’s possible to set up your Vaadin Portlet project as a multi-module Maven project. This allows each portlet to be placed into its own module, allowing for greater separation between the portlets. The separation makes it easier to separate concerns and allow several people or teams to work on the portlets simultaneously.
The multi-module Vaadin Portlet project can contain non-Vaadin Portlets in their own modules. A module may of course contain multiple portlets, if it makes sense for the project.
Multi-module project is the recommended setup for Vaadin Portlet projects. This chapter looks into what a multi-module project looks like for Vaadin Portlets, and how it can be set up.
Vaadin Portlet Multi-Module Project Structure
The project consists of 1+N modules, where N is the number of portlets in the project.
The 1 stands for the Vaadin front-end asset module.
All front-end assets used by the Vaadin Portlets are packaged into a single WAR
by the front-end asset module.
The asset WAR
can be deployed onto the same web server as the portlet WARs
, or onto some other file provider.
The following is a sketch of a possible project structure.
project-base
+-- frontend-bundle
+-- vaadin-portlet-1
+-- vaadin-portlet-2
:
+-- vaadin-portlet-n
For an example of a multi-module Vaadin Portlet project, take a look at the addressbook-portlet and the associated tutorial, Address Book Demonstration. The tutorial covers the project structure and how the different portlet components interact.
Setting up the above project structure requires some configuration in the pom.xml
files of each module directly related to portlets.
After the configuration is done, and everything has been built and deployed once, further portlet deployments require deploying only the WAR
file for the module being edited, if there are no front-end changes.
This section shows how to configure a multi-module Vaadin Portlet project.
Configuring a Vaadin Portlet Multi-Module Project
Configuring a Vaadin Portlet multi-module project has two requirements:
-
Portlet modules build
WARs
without front-end resourcesThis is achieved by not using
vaadin-maven-plugin
in thepom.xml
. Normally, Vaadin 23+ projects would havevaadin-maven-plugin
in thepom.xml
to enable packaging frontend files into theWAR
. Not using the plugin leaves theWAR
without front-end resources. -
Static asset module packages front-end resources from all portlet
WARs
This requires a bit more configuration. The static assets module needs to depend on all Vaadin portlet modules. This means, that each portlet module needs to build a
WAR
and aJAR
package. In addition, for the front-end resources to be available, the portlet modules need to be set up similarly to Vaadin add-on projects. Finally, the portlet modules need to be configured to fetch front-end resources from the deployed static front-end resource provider.
Enable webpack
Starting with Vaadin 23.2, Vite is the default tool for front-end builds.
However, Vaadin Portlet requires webpack to be used.
All modules must enable it with the webpackForFrontendBuild
feature flag, even if they do not package fronted files into the WAR
.
com.vaadin.experimental.webpackForFrontendBuild=true
See Feature Flags for more information.
Building Two Assets
Building both a WAR
and a JAR
can be achieved by configuring the maven-war-plugin
as follows:
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-war-plugin</artifactId>
<configuration>
<attachClasses>true</attachClasses>
</configuration>
</plugin>
Adding the attachClasses
flag instructs Maven to build a JAR
file with the -classes
classifier.
Use this JAR
as a dependency in your static assets module:
<dependency>
<groupId>your.group</groupId>
<artifactId>module-name</artifactId>
<classifier>classes</classifier>
</dependency>
Replace the groupId
and artifactId
with the correct values.
The portlet module is now used as a dependency for the static assets module.
Structuring Module as a Vaadin Add-on
The significant part of the project structure of an add-ons is the frontend
resource folder.
The folder is normally located at the root of the module for Vaadin 23+ projects.
In order for the front-end resources to be packaged into the JAR
file, place the files under the frontend
folder to /src/main/resources/META-INF/frontend/
.
Retrieving Front-End Resources from the Static Asset Artifact
Vaadin Portlet applications need to be instructed to retrieve the static front-end assets from the WAR
build from the static-vaadin-assets
module.
This is done by adding the file ./src/main/resources/META-INF/VAADIN/config/flow-build-info.json
.
After creating the file, put the following contents into the JSON file:
{
"externalStatsUrl": "/vaadin-portlet-static/VAADIN/config/stats.json"
}
For portlets running in Liferay 7, the JSON file should contain an o
segment:
{
"externalStatsUrl": "/o/vaadin-portlet-static/VAADIN/config/stats.json"
}
The /vaadin-portlet-static/
is the assumed name of the WAR
build from the static module.
If you rename the WAR
, change the JSON file to match.
If you need to place the static asset WAR
to some other web location, use the full URL to do so (keeping the /VAADIN/…
portion intact).
Note
|
The relative URL is mapped to port 8080 , so the above partial URL would map as http://127.0.0.1:8080/vaadin-portlet-static/VAADIN/config/stats.json .
If your web server is mapped to a different port, provide the full URL instead of a relative URL.
|
Deploying a Multi-Module Portlet Project
The deployment of a multi-module Vaadin Portlet project is very similar to that of the single-module project: deploy all the portlet WAR
files and the static assets WAR
file to your web server.
When editing a single portlet module, there are two different deployment patterns:
-
If you only edit the Java code of the portlet and don’t add front-end resources, you can rebuild the portlet
WAR
and only redeploy thatWAR
file. -
If you add front-end resources to your portlet module, you need to rebuild and redeploy the static assets
WAR
, as well as the portletWAR
itself.
ADA1B3CB-4B3E-4C9D-95CC-412B56CDD2CD