JS——requireJS、r.js

作者: 进击的阿群 | 来源:发表于2016-11-14 17:32 被阅读72次

    Q&A:

    1. 如下requirejs配置中, baseUrl 有什么作用?以什么作为基准? paths 的作用和用法是什么?

    requirejs.config({
      baseUrl: "src/js",  
      paths: {
        'jquery': 'lib/bower_components/jquery/dist/jquery.min'
      }
    });
    
    • baseUrl:设置默认根路径,如果没有设置,则baseUrl定义为应用require.js的html文件所在目录;
    • 基准:以html文件所在目录为基准;
    • paths:paths是相对路径,当需要引用的模块不在当前目录树下,或者文件名比较复杂时,可以用paths设置以简化;如代码中所示,用jquery名称id代替lib文件夹下很长的文件路径。

    2. 如下 r.js 的打包配置中 baseUrl 是什么? name 是什么

    ({
        baseUrl: "./src/js",
        paths: {
            'jquery': 'lib/bower_components/jquery/dist/jquery.min'
        },
        name: "main",
        out: "dist/js/merge.js"
    })
    
    • baseUrl:是当前目录下的src文件夹里的js文件目录;
    • name:入口模块的id名称,这里用main.js作为入口模块(主模块);
    • out:输出目录;

    Coding:

    使用 requirejs完成如下功能:

    • 首屏大图为全屏轮播
    • 有回到顶部功能
    • PORTFOLIO 使用瀑布流布局(图片高度不一),下部有加载更多按钮,点击加载更多会加载更多数据(数据在后端 mock)
    • About 每个时间区块默认隐藏,曝光渐变展示
    • 使用 r.js 打包应用
      预览
      代码

    本文归本人和饥人谷所有,如需转载请注明出处

    相关文章

      网友评论

        本文标题:JS——requireJS、r.js

        本文链接:https://www.haomeiwen.com/subject/besouttx.html