mithril-onsenui

Mithril bindings for Onsen UI

With Onsen UI you can create beautiful and performant hybrid apps that run on both Android and iOS. This package contains Mithril.js v2 bindings and components that makes it easy to integrate the Onsen UI components in Mithril apps.

For more information of what's included in Onsen UI please see:

• Main repo
• Official website
• Docs
• Playground

Installation

Package Manager (yarn, npm)

yarn add onsenui mithril-onsenui --save

Direct download

Get onsenui.js, onsenui.css and onsenui-css-components.css from the latest core release. You will also need mithril-onsenui.js file from this CDN link.

Including Mithril.js and Onsen UI

ES6 imports and Webpack (with CSS imports)

import 'onsenui/css/onsenui.css';
import 'onsenui/css/onsen-css-components.css';
 
import m from 'mithril';
import mOnsen from 'mithril-onsenui';
 

Direct include in index.html

<link rel="stylesheet" href="onsen-css-components.css">
<link rel="stylesheet" href="onsenui.css">
 
<script src="mithril.js"></script>
<script src="onsenui.js"></script>
<script src="mithril-onsenui.js"></script>
 
<!-- Mithril.use(MithrilOnsen) is called automatically if window.Mithril is defined -->

Examples - Running the development server

The examples are located under /bindings/mithril/examples directory in the main repo.

You can serve these examples by running the development server. First you need to build the main repo. When that is done you can run the following commands from /bindings/mithril/ directory:

yarn install
yarn run dev

This will open a development server with a kitchen sink app in localhost:8080.

Otherwise, have a look at the playground for online examples.

Support

If you need help using these bindings we recommend you to use our forum to ask questions. We also have a Gitter channel.

If you find any bug or want to request features/ API changes, please open an issue. Make sure to include all information necessary to reproduce it if you file a bug report.