文档章节

requirejs json插件(done)

cyper
 cyper
发布于 2015/11/25 14:31
字数 286
阅读 796
收藏 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
码字总数 143161
作品 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与SeaJS模块化加载示例

web应用越变的庞大,模块化越显得重要,尤其Nodejs的流行,Javascript不限用于浏览器,还用于后台或其他场景时,没有Class,没有Package的Javascript语言变得难以管理,于是出现CommonJS项目...

nosand
2014/05/04
0
10
RequireJS + AngularJS Seed 03 _RequireJS

在 index.html 里面引用 Requirejs。 这里第一部分src当然就是指requirejs的库文件。第二部分data-main是指入口配置。当前我指定的是scripts下面的bootstrap。requirejs默认的是js文件作为存...

开源中国匿名会员
2014/05/08
0
0
Angular项目构建指南 - 不再为angular构建而犹豫不决

前言 接触Angular也有小半个月了,虽然没有使劲折腾,不过正所谓"no zuo no die".学一门新东西,不好好折腾一下总觉得对不起祖国,最不起人民...好像扯远了,想写前言来着.为什么要写这篇构建指南...

顽Shi
2014/06/16
0
16
JS三教九流系列-require.js-网站模块化开发

js开发的模块化就是module处理 简单理解js模块化的开发就是让我们的web项目对js进行分类的处理 我们在开发网站的时候,里面会用要很多的类库,如jquery,还会有到基于jq各种插件,还会有其他...

透笔度
2015/08/19
0
0

没有更多内容

加载失败,请刷新页面

加载更多

awk命令用法介绍

10月18日任务 9.6/9.7 awk 1.awk(上)(下) 1.awk 分段操作功能 指定分隔符,并把第一段打印出来,不会改动文件内容 将所有内容打印出来 awk 没有指定分隔符号,则会默认用空格或者空白字符...

hhpuppy
29分钟前
0
0
Spring Cloud Eureka Server高可用之:在线扩容

本文共 1591字,阅读大约需要 6分钟 ! 概述 业务微服务化以后,我们要求服务高可用,于是我们可以部署多个相同的服务实例,并引入负载均衡机制。而微服务注册中心作为微服务化系统的重要单元...

CodeSheep
41分钟前
1
0
内网esxi主机上安装CoreOS虚拟机

CoreOS是一个为专门运行容器而设计的轻量级linux发行版,旨在通过轻量的系统架构和灵活的应用程序部署能力简化数据中心的维护成本和复杂度。它没有包管理工具,运行容器化应用以提供服务;默...

hiwill
今天
1
0
20181018 上课截图

![](https://oscimg.oschina.net/oscnet/49f66c08ab8c59a21a3b98889d961672f30.jpg) ![](https://oscimg.oschina.net/oscnet/a61bc2d618b403650dbd4bf68a671fabecb.jpg)......

小丑鱼00
今天
3
0
WinDbg

参考来自:http://www.cnit.net.cn/?id=225 SRV*C:\Symbols*http://msdl.microsoft.com/download/symbols ctrl + d to open dump_file Microsoft (R) Windows Debugger Version 6.12.0002.633......

xueyuse0012
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部