requirejs json插件(done)
博客专区 > cyper 的博客 > 博客详情
requirejs json插件(done)
cyper 发表于2年前
requirejs json插件(done)
  • 发表于 2年前
  • 阅读 773
  • 收藏 0
  • 点赞 0
  • 评论 0

新睿云服务器60天免费使用,快来体验!>>>   

摘要: done
requirejs到底有多少插件?执行bower search require, 结果如下:
➜  lib  $ bower search require
Search results:

    requirejs git://github.com/jrburke/requirejs-bower.git
    requirejs-text git://github.com/requirejs/text
    requirejs-plugins git://github.com/millermedeiros/requirejs-plugins.git
    requirejs-domready git://github.com/requirejs/domReady.git
    ...
➜  lib  $


这里:https://github.com/millermedeiros/requirejs-plugins, 上面列出了批量安装这些插件的方法:

➜  lib  $ bower install --save requirejs-plugins
...
➜  lib  $ bower list --paths

  'mustache.js': 'bower_components/mustache.js/mustache.js',
  pure: 'bower_components/pure/pure.css',
  'requirejs-plugins': [
    'bower_components/requirejs-plugins/src/async.js',
    'bower_components/requirejs-plugins/src/depend.js',
    'bower_components/requirejs-plugins/src/font.js',
    'bower_components/requirejs-plugins/src/goog.js',
    'bower_components/requirejs-plugins/src/image.js',
    'bower_components/requirejs-plugins/src/json.js',
    'bower_components/requirejs-plugins/src/mdown.js',
    'bower_components/requirejs-plugins/src/noext.js',
    'bower_components/requirejs-plugins/src/propertyParser.js',
    'bower_components/requirejs-plugins/lib/Markdown.Converter.js',
    'bower_components/requirejs-plugins/lib/text.js'
  ],
  text: 'bower_components/text/text.js'

然后我把json.js拷贝出来重命名为requirejs-json-0.4.0.js

修改requirejs config文件

require.config({
    baseUrl: 'lib/',
    paths: {
        jquery: 'jquery-2.1.4',
        underscore: 'underscore-1.8.3',
        mustache: 'mustache-2.2.0',
        templates: '../templates',
        text: 'requirejs-text-2.0.14',
        json: 'requirejs-json-0.4.0'
    },
    shim: {
        // nothing
    }
});

require(['../js/app'], function(App) {
    App.initialize();
})

修改module中的define如下:

define(['jquery', 'underscore', 'mustache', 'text!templates/nav.html', 'json!http://localhost:3000/blogs'],
    function ($, _, Mustache, navTemplate, blogPosts) {
    var initialize = function () {
        console.log('hello, $ is ', $.fn.jquery);
        console.log('hello, _ is ', _.VERSION);
        console.log("nav:", navTemplate);

        console.log(blogPosts);

        var info = [];
        $.each(blogPosts, function (key, val) {
            var blog = {};
            blog.title = val['title'];
            blog.description = val['description'];
            blog.slug = val['slug'];
            blog.keywords = val['keywords'];
            blog.created = val['created'];
            info.push(blog);
        });

        console.log(info);

        var template = navTemplate;
        var html = Mustache.to_html(template, info);
        $("#blogArea").html(html);

    };

    return {
        initialize: initialize
    }
});

修改的相关代码在此:https://github.com/uniquejava/replay.moqi.mobi/commit/7fd313a43d9d67d90df71450efd25a3149885610

标签: requirejs json
  • 打赏
  • 点赞
  • 收藏
  • 分享
共有 人打赏支持
cyper
粉丝 56
博文 619
码字总数 143069
×
cyper
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: