fd-init-easymob - npm explorer

1期——backbone扩展

- 路由：
支持afui声明式panel，自动生成路由配置，同时支持异步插入的panel，自定义配置

- view：
基于loadpanel初始化view render；
抽象view，支持定义tpl，自动载入、缓存tpl，unrender移除dom结构

- model：
基于配置项baseUrl，配置url对应resful方法

Quickstart

- rquire jquery2.0, underscore, backbone, appframework, appframework.ui(后续会结合成一个), easymob

- launch
`



$.ui.autoLaunch = false;    

$.ui.manageHistory = false;  // 关闭afui的路由功能



document.addEventListener('DOMContentLoaded', function(){

    af.ui.launch();

}, false);



var test = easymob.Application('test'); // 定义test全局命名空间



// afui ready后初始化easymob

$.ui.ready(function(){

    easymob.ready();

});



- router

easymob会根据div.panel自动生成router(生成规则请看Panel properties)



- view

view继承自 easymob.View (而不是Backbone.View) 

easymob.View对Backbone.View进行了扩展,initialize会自动载入|缓存tpl，renderPage渲染页面级别tpl；unloadpanel会触发unrender，移除DOM



test.d = easymob.View.extend({

	el: $('#d'),

	tpl: 'd',

	// 不要重写initialize

	// 入口方法，此处请求数据，renderPage()

	initPage: function(){

		this.renderPage();

	}

});





- panel properties



data-view="true"        // 需要easymob渲染，定义view；false或者不配置，则为静态页面

id="d"                  // id,对应view className

data-url="d(/:page)"    // 自定义路由，默认路由直接取id（即/d）,此例定义路由后，可以匹配http://127.0.0.1#/d/1 or http://127.0.0.1#/d





项目构建



fdm安装（0.4.6以上版本），使用说明



如果安装失败，请更新npm到最新版本 可通过安装最新的node安装包更新



npm install -g fdm





fdm更新



npm update -g fdm







源码下载



fdm init git@gitlab.alibaba-inc.com:1688/easymob.git





服务启动



fdm start server





$3



127.0.0.1 style.c.aliimg.com cdn.c.aliimg.com astyle.alicdn.com



$3



http://127.0.0.1/index.html



- 支持页面实时刷新(js/css/html/tpl变动)



- 支持html模板实时转amd(fmd)模块



- 支持url rewrite, 需要将style绑到本地

    

'^/m/test(.*)$ /src$1 [L]',//style代理到本地

'^(.).(css|js)(.)$ http://42.156.140.62$1.$2$3 [P]',//本地没有代理到线上





项目编译



fdm start build

```

- 复制(js/css)到build目录，目前不作打包压缩

1期——backbone扩展

Quickstart

- rquire jquery2.0, underscore, backbone, appframework, appframework.ui(后续会结合成一个), easymob

- launch
`



$.ui.autoLaunch = false;    

$.ui.manageHistory = false;  // 关闭afui的路由功能



document.addEventListener('DOMContentLoaded', function(){

    af.ui.launch();

}, false);



var test = easymob.Application('test'); // 定义test全局命名空间



// afui ready后初始化easymob

$.ui.ready(function(){

    easymob.ready();

});



- router

easymob会根据div.panel自动生成router(生成规则请看Panel properties)



- view

view继承自 easymob.View (而不是Backbone.View) 

easymob.View对Backbone.View进行了扩展,initialize会自动载入|缓存tpl，renderPage渲染页面级别tpl；unloadpanel会触发unrender，移除DOM



test.d = easymob.View.extend({

	el: $('#d'),

	tpl: 'd',

	// 不要重写initialize

	// 入口方法，此处请求数据，renderPage()

	initPage: function(){

		this.renderPage();

	}

});





- panel properties



data-view="true"        // 需要easymob渲染，定义view；false或者不配置，则为静态页面

id="d"                  // id,对应view className

data-url="d(/:page)"    // 自定义路由，默认路由直接取id（即/d）,此例定义路由后，可以匹配http://127.0.0.1#/d/1 or http://127.0.0.1#/d





项目构建



fdm安装（0.4.6以上版本），使用说明



如果安装失败，请更新npm到最新版本 可通过安装最新的node安装包更新



npm install -g fdm





fdm更新



npm update -g fdm







源码下载



fdm init git@gitlab.alibaba-inc.com:1688/easymob.git





服务启动



fdm start server





$3



127.0.0.1 style.c.aliimg.com cdn.c.aliimg.com astyle.alicdn.com



$3



http://127.0.0.1/index.html



- 支持页面实时刷新(js/css/html/tpl变动)



- 支持html模板实时转amd(fmd)模块



- 支持url rewrite, 需要将style绑到本地

    

'^/m/test(.*)$ /src$1 [L]',//style代理到本地

'^(.).(css|js)(.)$ http://42.156.140.62$1.$2$3 [P]',//本地没有代理到线上





项目编译



fdm start build

```

- 复制(js/css)到build目录，目前不作打包压缩