Nebula build

Build a nebula visualization bundle

Usage

nebula build

Example

Build the bundle with a nebula configuration json file in a new path

nebula build --config config/my-nebula-config.js

Rebuild the bundle when files in /src folder change on the disk

nebula build --watch

Build the bundle without a source map file - .js.map file

nebula build --sourcemap false

Bundle is not minified in the development mode

nebula build --mode development

Do a normal build and build an extra esm module into /core directory

nebula build --core

Include typescript files in the bundle

nebula build --typescript

Options

ParameterDescriptionDefault
--versionShow version number
--config, -c stringSet path to JSON config file"nebula.config.js"
--watch, -wWatch source filesfalse
--sourcemap, -mGenerate source maptrue
--mode string ("production"|"development")Explicitly set mode"production"
--core stringSet a core build target"core"
--typescriptEnable typescript bundlingfalse
-h, --helpShow help for command

Details

Module bundler

The underlying of nebula build is rollup.js - a module bundler, compiles pieces of code into files in a /dist directory.

Those files are exported in two formats, umd (Universal Module Definition) and esm (ES2015 Module). They can be used by nebula sense to generate Qlik Sense readable files as an Extension.

Configuration file

In the config file, build properties:

  • Version
  • Sourcemap
  • Mode
  • Core
  • Typescript

The following code in a config file demonstrates an example to set the nebula build configuration.

const path = require('path');
const targetPkg = require(path.resolve(process.cwd(), 'package.json'));
const replacementStrings = {
  'process.env.PACKAGE_VERSION': JSON.stringify(targetPkg.version),
};
const mode =
  process.env.NODE_ENV === 'production' ? 'production' : 'development';
const sourcemap = mode !== 'production';

module.exports = {
  build: {
    replacementStrings,
    sourcemap,
    mode,
    core: 'core',
    typescript: true,
  },
};

Watch

watch function provided by Rollup.js that rebuilds your bundle when it detects that the files in /src folder have been changed on the disk.

Source map

A source map is a file that maps from the bundled source file to the original source files, enabling the browser to reconstruct and present the original source code in the debugger. So if there is an error in a file in the /dist directory, the source map can tell you the original source file location.

Basically, source map is helpful for debugging and should be removed for production.

Core build

You can export only the esm bundle by adding --core parameter.

To achive that, you need to add a package.json file in the /core directory. In the package.json file, a module field which specifies the output file from the build is required:

"module": "dist/hello.esm.js",

The package.json can also have a different list of peerDependencies changing what dependencies are included in the output file.

Then run the following command:

nebula build --core

The code is exported into /core directory

When you want to specify your directory instead of the default one, you can move that package.json file into your directory and run the following command:

nebula build --core minimal/target

The code is exported into /minimal/target directory

Tips: In the package.json file, the main field makes sure that Node users using require can be served the umd version. The module field is a common convention to designate how to import an esm version of your code.

Typescript

With this option you can enable typescript bundling of your code. Add a tsconfig.json file to configure typescript to your own preferences.

nebula build --typescript
Was this page helpful?