This article explains how to release webpack.Webpack bundles are used with Static Resource Server (SRS). SRS, Cloud Gateway, Keycloak and censhare Server are related to censhare WP (webpacked).

Introduction

Webpack: is a static module bundler for modern JavaScript-based web applications. To create the bundle(s), Webpack processes the application, and builds a dependency graph that maps all required modules of a project and their dependencies. All files are then packed into one or more bundles. In production systems, it also uses minification and removes unused code.

The Webpack bundles are then once served to the web browser. This reduces the server load dramatically. It also improves browser performance because HTTP is limited to few simultaneous requests. Altogether, it results in a better performance.

The webpack release includes:

  • standard webpack bundle webpack-<version>.tar.gz that can be deployed as is
  • client source archive censhare-Client5-webpack-<version>.tar.gz that can be used to build webpack bundles that include additional customizations.

Preparation

To build the webpack project locally (frontend), clone the repository below. Otherwise, deploy it directly from docker hub.

Webpack Angular-Cli integration repository: https://git.censhare.com/censhare/censhare-product/-/tree/develop-wp.

You must clone this branch to create a webpack release. It does not work if you use developer branch.

To clone the repository, execute the git clone command:

git clone -b develop-wp https://git.censhare.com/censhare/censhare-product

Releasing webpack

You can create webpack release if:

  • You want to ship the frontend as an archive to a customer.
  • You want to upload the frontend as an archive to artifactory as a part of a pipeline.

To build a webpack release, run the following command

censhare-product/censhare-Server/bin/build.sh clean release

This command creates a folder release-<version> that contains:

  • build directory with webpack sources. The directory is used to rebuild censhare-Client5 from it if any customization is required.
  • censhare-Client5-webpack-<version>.tar.gz: archived content of build folder
  • webpack-<version>.tar.gz: default censhare-Client5 files that are bundled with webpack.

The deployment configuration of the Static Resource Server then references a webpack release.

Rebuilding webpack after customization

Either unpack censhare-Client5-webpack-<version>.tar.gz or go to build directory:

cd ~/censhare/censhare-Custom/custom/

Add your customization and go to ~/censhare/censhare-Client5/web folder:

cd ~/censhare/censhare-Client5/web/

Rebuild webpack:

yarn
yarn cs5 release

Uploading webpack to Artifactory

Run Jenkins job: https://jenkins.censhare.com/job/webpack_build/.

This command creates a default webpack using team/arch/webpack-angular-cli-integration branch of censhare-product and uploads it to Artifactory.

You can check the result by going to https://artifactory.censhare.com/artifactory/libs-all/com/censhare/microservices/webpack/<version>/.

From Artifactory, the webpack then can be pulled to Kubernetes or any other place.

Last Updated: 23 March 2020