Materia Widget Development Kit (MWDK) is a local development environment for quickly building Materia Widgets.
The MWDK automatically watches changes to your widget source files and re-builds assets on the fly using an in-memory webpack dev server. Just save your file and reload the browser to see changes.
Some MWDK Features include:
- Supports player and creator html files
- Utility for easily building .wigt packages
- Materia API mocking
- Reusable Webpack rules common to many widget build processes
Build Widget Players
MWDK loads your widgets demo.json QSET into the player automatically. It handles all API calls a widget makes to the Engine Core.
Build Widget Creators
MWDK loads and displays your creator for easy development and testing. There is a mock question set importer and a mock media importer for testing those features in your creator. It handles all API calls a widget makes to the Creator Core.
Package WIGT files
To aid in widget packaging and testing, MWDK includes features to build and download a .wigt file. If you’re using Materia Docker to run a local development Materia Server - MWDK has a script to install it to the server for you.
Using the MWDK
The MWDK is an npm package that is included as a dev dependency in your widget’s package.json.
Install using npm:
$ npm install materia-widget-development-kit --save-dev
Configuring Your widget
Using the MWDK’s common Webpack Rules
The MWDK offers several default webpack rules that are common across most widget build processes accessed through the webpack-widget file.
The three main functions used to access these rules are:
This function returns the typical rules used for loading, compiling, and copying development files for production. If you are developing a widget that requires a rule that isn’t current default (e.g. React), you will need to add your own rule to your webpack config.
This function returns the default items that need to be copied verbatim from the dev environment to production. See the wigt package structure to see what assets and directories are required.
Running the MWDK
$ npm run start
$ yarn start
Install with yarn:
$ yarn add materia-widget-development-kit --dev