• Dojo的UI框架bootstrap for dojo和Dojo-Bootstrap简介


    最近在学习Dojo,但样式问题真是头疼呀,虽然清新的淡蓝色很是减缓眼睛的疲劳,但这个扁平化简约风盛行的年代,光是清新的拟物已经满足不了群众的需求了,所以就在这样的需求下,我知道了bootstrap for dojo UI 的存在,并且好消息是这个是基于 BSD和Apache的开源协议,也就是说和dojo一样可以改源码,可以免费商用,你的项目也不用必须开源,跟Dojo一样,很爽吧。

    在github上的地址是https://github.com/atoha/dbootstrap,演示地址是http://martinpengellyphillips.github.com/dbootstrap/,谁说dojo没有extjs好看,只是因为自己懒吧,既然懒,还不找找大牛制造的轮子么,好了,等我兴致勃勃的下载下来后发现不知怎么运行,这时候就是此篇博客所要发挥的重要性了。

    首先下载,不要点github上的下载zip按钮,因为项目中有的文件是别的项目的文件,直接下载不会包含引用的文件,要复制下面说明中的

     git clone --recursive git://github.com/martinpengellyphillips/dbootstrap.git

    这个我就不详细说了,用过git的都知道怎么弄了,没用过的学下吧,有好处。

    git 下载后的目录结构是这样的

    你的下载文件可能比我多几个,这是因为我把没用的删掉了。并且你们也没有build目录,这个目录就是我们最后要生成的目录,继续往下看吧!

    之后就是重头戏了

    这里需要安装四个文件,至于安装方法我只能简单概括,毕竟安装软件对于工程师来说应该不算什么难事,网上的帖子说的比我要详细的很多。

    第一步:安装python,这里要注意python的版本有所限制,要大于等于 2.6,小于3,现在官网最新的python2.x的版本是2.7,所以我使用的是2.7版本,就好似你需要兼容IE8一样,不能使用jquery2.1.4一样,只能用1.11.3。

    第二步,安装node,这个步骤我就不说了,自行查吧,很简单。但要版本大于等于0.10.5,还好现在官网的下载连接都是0.12.x的了

    第三部,安装stylus,这个stylus其实是一个css预编译语言,只不过这里说的是一个基于node构建的编译styl文件的模块,所以你安装完node后,想必你也知道npm了,就是一个node模块的管理工具,在控制台中输入:

    npm install -g stylus

    即可,之后等待安装完毕,-g一定不要丢了,这个很重要,意思是这个模块在任何文件目录下都可用。stylus的版本要求是最低0.31,但你在看这篇帖子的时候npm下来的版本已经大于这个版本了,无需关心。

    第三部,java jdk安装,这个更不用说的。配置jdk环境的帖子比配置node的都要多,自己搜下吧,但要7以上才行,我用的最新的8.

    当这些步都搞定的时候接下来就是生成可运行的demo时候了:

    也很简单cd进入到dbootstrap目录,也就是有build.py文件的根目录下

    运行以下命令行

    python build.py demo

    此时就会在dbootstrap目录下生成build目录,这个目录就是编译后的文件,但入口的html文件在dbootstrapsourceindex.html下,此时在服务器环境中运行index.html即可,如下:

    怎么样,完全的bootstrap风格吧,但全是这种风格看多了,我怎么感觉bojo的默认风格反而更好看呢,哈哈!!!

    第二次添加:

    另一个DojoUI框架:Dojo-Bootstrap

    这个一个网友推荐的,我也就看了下,毕竟因为自己懒吗,不想自己写,嘿嘿。

    github地址:https://github.com/xsokev/Dojo-Bootstrap

    演示地址:http://xsokev.github.io/Dojo-Bootstrap/

    这个的构建要比第一个要简单

    直接下载文件,之后进入到项目根目录,用bower下载依赖项

    第一步:安装bower

    npm install -g bower

    第二步:安装依赖

    bower install

    此时就可以运行Dojo-bootstrap/tests/index.html了

  • 相关阅读:
    leetcode-Single Number
    设计模式六大原则(4)——接口隔离原则
    设计模式六大原则(3)——依赖倒置原则
    设计模式六大原则(2)——里氏替换原则
    设计模式六大原则(1)——单一职责原则
    观察者模式
    转:画图工具
    android 博客列表
    app crash率的标准
    查看某一个开发者代码修改量的脚本(ios平台可用)
  • 原文地址:https://www.cnblogs.com/woleicom/p/4675480.html
Copyright © 2020-2023  润新知