mithril-starter-rollup's Introduction

mithril-starter-rollup

Project setup with:

Mithril 2.x
Rollup for optimized module bundles
Babel for transpiling es2015 to es5

A couple of styles are included using Tachyon, but these can simply be replaced with your own CSS solution.

Setup

Install dependencies

npm install

Build and watch

Script commands defined in package.json:

build: creates a minified bundle in dist/js/
serve: serves the build directory at localhost:5000
dev: starts a local webserver; creates a bundle in dist/js/ that is being updated with each code change; calls LiveReload to refresh the browser after code changes are built

Call npm run dev and open a web page at localhost:3000. The port number is set by environment variable PORT in package.json.

When making changes, the terminal will show lint errors, if any.

Configuration files

scripts contains a couple of Rollup configuration files. The scripts use rollup.base.js as base configuration.

FYI, the base configuration:

Exports createConfig({ includeDepencies })
Reads package.json to read package dependencies. If includeDepencies is true, it will include those dependencies in the build file
Creates global package names; and sets global m for package "mithril".

Bundler configuration

rollup.es.js: Builds an ES2015 module with syntax features that node supports
rollup.umd.js: Builds a UMD bundle
rollup.watch.js: Builds a UMD bundle that is updated with each file change

Optional environment variables:

DEPS (Number 0 or 1): include dependencies
WATCH_DIR (String): sets the watch directory when running the dev script
PORT (Number): sets the http server port when running the dev script

Other configuration file:

.babelrc: Babel configuration

License

MIT

mithril-starter-rollup's People

Contributors

Stargazers

Watchers

mithril-starter-rollup's Issues

package.json scripts do not work on Windows

Scripts defined in package.json do not work on Windows.

Working variant:

...
  "scripts": {
    "build": "yarn run clean && yarn run rollup",
    "rollup": "rollup -c ./scripts/rollup.umd.js --environment DEPS:1 && rollup -c ./scripts/rollup.es.js --environment DEPS:1",
    "clean": "rm -rf dist/js && mkdir dist/js",
    "dev": "rollup -c ./scripts/rollup.watch.js --environment DEPS:1,PORT:8080,WATCH_DIR:./dist/ --watch",
    "test": "jest src/**",
    "test:watch": "jest src/** --watch"
  },
...