A lightweight and powerful JavaScript MVVM library for building web UI component.
npm install sugar-js> A lightweight and powerful JavaScript MVVM library for building web UI component.
Simple api and without any dependence.
Consists of two independent libraries:
sugar.js Component system + MVVM , for building flexible web component*.
mvvm.js Achived above MVVM , it doesn't rely on sugar, it can be used independently*.

html
{{ title }}
`
`javascript
// define HelloWorld component:
var HelloWorld = Sugar.Component.extend({
init: function (config) {
this.Super('init', config, {
target: '#app',
model: {
title: 'Hello world!'
}
});
}
});// create component instance:
var app = Sugar.core.create('hello-world', HelloWord);
`
And then the HTML structure was rendered/parsed to be:
`html
Hello world!
`
Data reactive (Model Drive View):
`javascript
app.vm.$data.title = 'Change the title!'; // Change the title!
`
More MVVM directives are supported, see all at documentation.Demos
There are several complete and amusing demos in
demos/ folder make you know more about sugar.js, check it out and preview them in the following links:* StarRating
* DatePicker
* TodoMVC
* Snake eat apple game
> i. Sometimes Github-page link disconnected by
Enforce HTTPS, please use https protocol instead.> ii. Some demos need httpSever (Ajax), so run script
npm run server to preview them if in your local.You can also experience
sugar.js online with a RadioComponent at jsfiddle.
Usage
* Get by NodeJS package:
npm install sugar-js --saveUMD (Universal Module Definition)
* mvvm.js (just 28 kb) https://tangbc.github.io/sugar/dist/mvvm.min.js
* sugar.js (just 35 kb) https://tangbc.github.io/sugar/dist/sugar.min.js* Browsers: Not support IE8 and below. Besides, support most modern desktop and mobile browsers.
Documentation
Get start and check documentation on Wiki.
Directories
*
build/ Development, production and test configurations.*
demos/ Several complete examples/demos developed by sugar.js.*
dist/ Product files of sugar.js and mvvm.js, and their compressed.*
src/ Source code module files: *
src/main/20% A simple component system. API & Doc *
src/mvvm/80% A powerful and easy-using MVVM library. API & Doc*
test/ Unit test specs writing by karma + jasmine.
Contribution
Welcome any pull request of fixbug or improvement, even only supplement some unit test specs.
1. Fork and clone repository to your local.
2. Install NodeJS package devtools:
npm install.3. Develop and debug:
npm run dev (generate sourcemap files in bundle/).4. Add and write test spec, (in
test/units/specs/) then run uint test:npm run test.5. Generate the test coverage report and jshint checking up:
npm run build`.