The content of this article applies to LuciadRIA 2019 and older only.

As of LuciadRIA 2020, webpack is much more tightly integrated with the LuciadRIA distribution. It is used for bundling and serving the LuciadRIA sample applications, and the loader is shipped with the distribution.

For more information, see:

Because code speaks louder than words, this article gets you started with a sample project that shows you how to use LuciadRIA with webpack. You can download the sample here.

The sample demonstrates how you can create production builds with webpack. It includes a webpack-based development server ( webpack-dev-server ) that supports Hot Module Replacement (

Sample prerequisites

To run the sample, you need:

  • A Node.js environment installed on your development machine, together with the latest version of NPM. You can download Node.js from We recommend the LTS version.
    Run npm install npm -g on a command line to update NPM to the latest version.

  • A LuciadRIA release of at least version 2017.1. You can use older versions as well, but LuciadRIA version 2017.1 or a more recent version comes recommended if you’re using webpack.

Sample usage instructions

  1. Download the ria-webpack sample file from this article, and unzip it.

  2. Consult the sample setup, development and build instructions in the file that comes with the downloaded sample.

Sample highlights

  • LuciadRIA is installed through NPM, even though it isn’t available on the public NPM registry. In package.json, you can see that the luciad dependency points to a folder on the local file system.
    When you run npm install, NPM creates a symbolic link from node_modules to the specified folder.

  • See the webpack.config.js file for the configuration of the webpack:

    • LuciadRIA isn’t minified with UglifyJS for production builds, but is already minified in the release. Excluding LuciadRIA from minification reduces the time it takes to generate a build.

    • The rule for loading .txt files is necessary for packing the LuciadRIA license into the bundle. See entry.js for more information.

  • entry.js sets the license using the luciad/util/License API. Note that the license is set before the rest of the application is loaded.