新的里程碑

[RubyLouvre]

$ npm init // 用于初始化项目的package.json $ npm install webpack -g $ npm install style-loader css-loader url-loader babel-loader sass-loader file-loader -g

然后每个子目录下 npm link webpack style-loader css-loader url-loader

http://www.tuicool.com/articles/2qiE7jN

[RubyLouvre]

[RubyLouvre]

如何参加：

fork一下avalon.bootstrap项目 clone到本地， 然后全局安装如下几个东西

$ npm install webpack style-loader css-loader url-loader -g

在　js目录下已经有几个转换好的组件

然后自己新建一个目录，名字为组件名

（下面有 组件名.js, index.js, doc.js, package.json, webpack.config.js ）

然后npm link webpack style-loader css-loader url-loader

组件的编写详见：http://avalonjs.github.io/#zh/bindings/component.html

现在是使用　nodejs风格编写的

大家参考一下 https://github.com/twbs/bootstrap/tree/v4.0.0-alpha/js/dist

里的某个组件代码，CSS沿用原来的HTML结构与类名

这里可以查看到它们的HTML结构

http://v4-alpha.getbootstrap.com/components/pagination/

想查看效果，直接webpack

然后改写，提pull request给我

[RubyLouvre]

http://iarouse.com/dist-slim/v1.3/index.html#/ui/components

另一个可以参考的项目

[RubyLouvre]

avalon.bootstrap组件编写规范

多用事件代理

每个组件的vm，如果估计用户会操作根节点（自定义标签），那么使用_element放置此节点，并设置为非监控属性，此元素上还添加["ms-"+widgetName+'-vm']属性来引用VM，详见nav, progress组件。

[RubyLouvre]

http://iarouse.com/dist-slim/v1.3/index.html#/ui/grids