Modules
Tabris.js uses the “CommonJS” module system, same as Node.js.
This means:
- Each JavaScript file represents a module.
- Each module has an implicit local scope. A variable declared with
var,letorconstwill never be global. - The module code will not be parsed and executed until the module is imported.
- To access a value (e.g. a class) created by module A in another module B, it needs to be exported by A and imported by B
Startup
When the application starts, it will load the main module to kickstart your application. It is identified in the main field of your project’s package.json. For example:
{
"name": "my-app",
"version": "1.0",
"main": "dist/my-main-script.js"
}
This main module can then import other modules of your application, or third party modules installed in your project via npm.
Tabris.js does not support npm modules installed globally on your development machine, only those installed locally in the projects
node_modulesfolder. Also, npm modules that depend on native node.js modules like'http'do not work.
The Tabris.js API is also available globally (without importing) and can be accessed immediately under the tabris namespace. Therefore “new tabris.Button();” always works, while “new Button();” requires Button to be imported from 'tabris'.
Some other values available without import (i.e. in the “global” namespace) are: console, Math, setTimeout, setInterval, clearTimeout, localStorage, XMLHttpRequest, fetch, device, ImageData and WebSocket.
Syntax
The exact import/export syntax differs depending on your project setup.
The modern ES6 syntax is preferred and used throughout this documentation. ES6 Modules support is not provided by Tabris.js directly but by a third party compiler like tsc (works for both JavaScript and TypeScript files), or bundling tools like WebPack. For an in-depth explanation of this syntax please refer to the either
- the MDN articles on import and export statements, or
- the module chapter in the TypeScript handbook.
If you use a vanilla JavaScript project without a compiler/bundler you have to use the ES5/CommonJS syntax (i.e. require()). You can get
- an overview of the syntax on the CommonJS Wiki, or
- a detailed explanation in the Node.js docs.
The Node.js implementation is the standard that Tabris.js follows and aims to be compatible with.
