The instructions in this article are applicable only if you want to tinker with the LuciadRIA sample code yourself. To start the LuciadRIA samples as they come in the release, without modification, start the sample server with the |
Quick overview
-
Make sure your system setup covers all prerequisites, as described in the installation instructions.
-
Run
npm install
in the root of the LuciadRIA distribution.
This command installs all sample dependencies. You must install these once for a release. See Bootstrapping dependencies. -
Start the sample server with the
startSampleServer
script in the root of the LuciadRIA distribution. See Running the sample server for more information. -
Run
npm run dev
in the directory of the sample you want to edit and run.
A browser window opens automatically. It runs your sample and watches the files in that directory. If you edit and save a file in that directory, the running sample changes automatically, and the browser window refreshes. See Running a webpack dev-server for a sample.
Bootstrapping dependencies
Before you can deploy the samples in the samples/
directory, you must install all dependencies of the
LuciadRIA distribution and its individual samples. To install the dependencies, you must execute
npm install
in the root of the LuciadRIA distribution. This command first installs all development dependencies declared in the root
package.json
, and then executes
lerna bootstrap
, through a post-install script. The lerna bootstrap links the local dependencies of all samples to the correct packages and
installs all external npm dependencies in the correct node_modules
folder.
Lerna also takes care of dependency hoisting: dependencies that are common to
different samples are only installed once in a higher-level node_modules
directory.
After bootstrapping the dependencies of all samples, you can set up your web application.
Running the sample server
Several samples don’t fetch their data locally, but request it from a server, or use other data services. The
LuciadRIA distribution offers a sample server to host those services. You can run the sample server by executing the
startSampleServer
script. http://localhost:8072 hosts the server by default.
Running a webpack dev-server for a sample
When you are developing an application, it’s useful to run a development server, or dev-server. A development server serves the application and watches the source files for changes. It serves those changes without a server restart. To start a webpack dev-server for a sample application in the LuciadRIA distribution:
-
Make sure you have bootstrapped the sample dependencies, as explained in Bootstrapping dependencies.
-
Go to the
samples/
directory and executenpm run dev
.
By default, a dev-server starts hosting the First Sample onhttp://localhost:3001/
. It also watches the bundled files so that it can pick up and serve any changes in the source code or styling as long as it is running.
You can also add arguments to npm run dev
by adding --
and one or more argument tags at the end:
--port=<PORT>
-
Specify the port on which the webpack dev-server must run.
--isWebGL
-
Set this argument to run the sample using a WebGL map.
--is3D
-
Set this argument to run the sample using a 3D WebGL map.
--sampleServerUrl=<URL>
-
Specifies the URL (and port) on which the sample server is running.
--luciadFusionUrl=<URL>
-
Specifies the URL (and port) on which the LuciadFusion server is running.
--ie11support
-
Package the samples with support for Internet Explorer 11 (IE11). Add this argument to transpile the sample and the LuciadRIA API so that they are compatible with IE11.
The webpack configuration file of all samples extends from samples/common/webpack.config.js
. See
the webpack configuration web page for more information.
Building and running the sample
When you are deploying a real application, just running the provided webpack dev-server isn’t enough. You must take care of other steps, such as minification/uglification or chunk splitting as well, before you can serve the application.
Building and running samples may require a significant amount of memory. To execute the build, you need to configure
the amount of memory that Node.js can use. You can do so by setting the NODE_OPTIONS environment variable to |
To build and run the application, take these steps:
-
Run the
npm run build
command in the sample directory.
The sample is packaged topacked-samples/ria/<sample>
The original sample in that directory will be overwritten, so it might be a good idea to back that up first.
-
Start the sample server by running the
startSampleServer
script. -
Open your browser, and point it to
http://localhost:8072/samples/<sample>
. A new web page displays your application.
This uses the same webpack configuration file as discussed in Running a webpack dev-server for a sample.