文档章节

requirejs json插件(done)

cyper
 cyper
发布于 2015/11/25 14:31
字数 286
阅读 807
收藏 0
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

© 著作权归作者所有

共有 人打赏支持
cyper

cyper

粉丝 58
博文 685
码字总数 143207
作品 0
武汉
前端工程师
私信 提问
使用 RequireJS 来优化你的 JavaScript 代码

RequireJS是一个提高你的javascript代码速度和质量的有效方法,同时它还让你的代码更容易阅读和维护。 在本文中,我会为你介绍RequireJS和应该如何使用它。我们讨论引入文件和定义模块,甚至...

oschina
2013/02/12
4.9K
11
教你5分钟学会用requirejs(必看篇)

转来:教你5分钟学会用requirejs(必看篇) requirejs是干啥的啊? 曾经,我们将一些js组件放到不同的文件,然后通过script标签引入,如果几个组件有依赖,那么要小心了,你必须将被依赖的放到...

spinachgit
2018/10/31
0
0
RequireJS极简入门教程

RequireJS is a JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node. Using a modular s......

程序员诗人
2017/03/30
0
0
RequireJS 入门指南

简介 如今最常用的JavaScript库之一是RequireJS。最近我参与的每个项目,都用到了RequireJS,或者是我向它们推荐了增加RequireJS。在这篇文章中,我将描述RequireJS是什么,以及它的一些基础...

oschina
2013/08/15
70.2K
37
使用 RequireJS 优化 Web 应用前端

基于 AMD(Asynchronous Module Definition)的 JavaScript 设计已经在目前较为流行的前端框架中大行其道,jQuery、Dojo、MooTools、EmbedJS 等纷纷在其最新版本中加入了对 AMD 的支持。本文...

IBMdW
2012/09/11
8.6K
16

没有更多内容

加载失败,请刷新页面

加载更多

lucene 评分要素解析

基本规则:

Java搬砖工程师
25分钟前
0
0
ubutnu 14.04 安装JIRA

系统版本:Ubuntu 14.04 下载jira安装文件 sudo wget https://downloads.atlassian.com/software/jira/downloads/atlassian-jira-software-7.1.9-x64.bin 修改文件权限 sudo chmod 777 atl......

Kampfer
35分钟前
0
0
软件开发模型优缺点及其适用范围

瀑布模型、快速原型模型、增量模型、螺旋模型 瀑布模型也称软件生存周期模型。 优点: (1)它在软件工程中占有重要地位,它提供了软件开发的基本框架,这比依靠“个人技艺”开发软件好得多。...

无极之岚
36分钟前
0
0
孩子们各显神通对付 iOS 12「屏幕使用时间」的限制

简评:2018 年秋季,苹果公司推出了 iOS 12,其中备受好评的一项改变是:增加了屏幕使用时间限制,以减轻沉迷手机的状况。三个月过去后,这项功能似乎并没有对孩子造成太多困扰,道高一尺魔高...

极光推送
41分钟前
2
1
springCloud Spring Boot mybatis分布式微服务云架构-docker-feign-hystrix-ribbon(七)

简介 在上一节中,我们讨论了feign+hystrix在项目开发中,除了考虑正常的调用之外,负载均衡和故障转移也是关注的重点,这也是feign + ribbon+hystrix的优势所在,本节我们就讨论一下在feign...

sccspuercode
41分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部