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 (https://github.com/webpack/docs/wiki/hot-module-replacement-with-webpack).
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 https://nodejs.org/en/. We recommend the LTS version.
npm install npm -gon 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
ria-webpacksample file from this article, and unzip it.
Consult the sample setup, development and build instructions in the
README.mdfile that comes with the downloaded sample.
LuciadRIA is installed through NPM, even though it isn’t available on the public NPM registry. In
package.json, you can see that the
luciaddependency points to a folder on the local file system.
When you run
npm install, NPM creates a symbolic link from
node_modulesto the specified folder.
webpack.config.jsfile 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
.txtfiles is necessary for packing the LuciadRIA license into the bundle. See
entry.jsfor more information.
entry.jssets the license using the
luciad/util/LicenseAPI. Note that the license is set before the rest of the application is loaded.