meti v0.0.0

Meti - Multi page application solution.

Install

$ npm install meti

// or

$ bower install meti

Usage

import Meti from 'meti';

// plugins
import fetch from 'path/to/plugins/fetch';
import promise from 'path/to/plugins/promise';

// components
import all from 'path/to/components/all';
import foo from 'path/to/components/foo';
import bar from 'path/to/components/bar';
import baz from 'path/to/components/baz';

let app = new Meti({
    name: 'hello',
    // ...
});

// install plugins
app.install(fetch)
app.install(promise)
app.install(is)
// or
app.install([fetch, promise, is]);

// use components
app.use(foo);
app.use(bar);
app.use(baz);
// or
app.use([foo, bar, baz]);

// map components to page
// the mapper's key is `data-page` attribute of the `body` tag in page.
app.map({
    'foo': foo,
    'bar': bar,
    'baz': baz,
    '*': all,
});

Plugins

// plugin `is`
export default {
    name: 'is',
    plugin: {
        ios: true,
        android: false,
    },
};

// plugin `fetch`
export default {
    name: 'fetch',
    plugin: function fetch() {
        return fetch();
    },
};

Components

// component `foo`
// `this` in component is bind to `Meti`'s instance.
export default {
    data() {
        if(this.$is.ios) {
            console.log('this is ios device.');
        } else if(this.$is.android) {
            console.log('this is android device.');
        } else {
            console.log('this is unkonwn device.');
        }

        let API = `http://api.hello.com`;
        this.$fetch(API)
            .then(response => response.json())
            .then(data => {
                console.log(data);
            });
    },
};