zoukankan      html  css  js  c++  java
  • requirejs 配制

    baseUrl: 用来配制动态加载脚本时,脚本文件的起始位置,此属性可以指定值,也可以由 requirejs 自动计算出值:

      1:不进行任何配制: 假如 a.html 中引用 require.js 文件 <script src="require.js"></script>

        这样在 require(['util'],...)  的时候,util.js 的路径就是和 a.html 在同一个目录.

     

      2:通过 data-main 属性指定主文件:假如 a.html 中引用 require.js 文件 <script data-main="../app/main.js" src="require.js"></script>

        这种情况下,requirejs 会把 "../app/"  作为 baseUrl 属性的值,在 require(['util'],...)  的时候,util.js 的路径就是 ../app/util.js 了。

      3:显示指定 baseUrl 属性:假如 /admin/home.html 中引用 require.js 文件 <script data-main="../app/main.js" src="require.js"></script>

        在 main.js 中配制了 baseUrl 的值为 'lib' 值,在 require(['util'],...)  的时候,util.js 的路径就是 lib/util.js, 这是相对于 home.html 文件, 对于网站的绝对地址就是 /admin/lib/util.js 了。

      从上面的三种情况可以看取, requirejs 生成脚本路径的时候,就是把 baseUrl 加上 脚本的路径。

        

      另外一个比较特殊的方式加载js文件。当以以下三种方式来加载js文件时,加载的路径将绕过上述的这些配置(意思是设置什么路径就以什么路径加载,不对路径进行任何处理)。这三种方式包括:

        1、以/开头的路径。
        2、以.js结尾的路径
        3、以协议http或https开头的路径

    paths: 用来配制一些路径的别名,在 require 的时候直接使用别名就可以加载相应的脚本。

        paths 也可以文件夹的别名,如控件全部放在 lib/common/controls/ 目录下面,如果在不取别名的情况下,引用一个控件需要这样 require(['lib/common/controls/date'], ...), 如果在 paths 里配制了 'controls': 'lib/common/controls' 后, 就可以 require(['controls/date'], ...) 了。

        paths 还有备错配制功能,如 jquery 的库默认从 cdn 上加载,如果 cdn 加载不成功就从本地加载:

        'jquery':['http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min', 'lib/jquery']

    shim: 配制一些未按 AMD 模式定义的库,(在 requirejs 中,模块使用 define 方法定义,define 方法会有一个返回值,这返回值就是模块的对象),如 jquery 的一些插件及以前一些老点的库,都没有按这些方式做,所以需要通过 shim 属性来配制一下:

        shim: {

          'bold': [

            'deps': ['jquery'],

            'exports': 'jQuery.fn.bold'

          ]

        }

      上面的代码中,主要是 exports 属性,这此属性的意思是当文件加载成功后, requirejs 从哪个变量中获取文件中所定义的对象,其实就是一个变量名称,requirejs 通过这个变量名称获取到一个值,并传递到相应的方法。

    urlArgs: 用来指定在加载脚本时,附加在脚本 url 地址后面的参数,如 urlArgs: 'ver=10001', 那么在动态加载的所有的脚本文件中,都会加上这个参数。

    bundles: 当一个文件中定义了多个模块时,就需要使用此属性来进行相应的配制 bundles: { jsUtil:['MathUtil', 'DateUtil'] }, jsUtil 是文件名称, MathUtil 和 DateUtil 是通过 define 定义的模块名称,这样定义后,就可以使用 require(['MathUtil', 'DateUtil']...) 的方式对模块进行相应的引用。

  • 相关阅读:
    2020软件工程作业01
    问题清单
    2020软件工程个人作业06——软件工程实践总结作业
    感谢随笔
    2020软件工程作业05
    2020软件工程作业04
    2020软件工程作业03
    2020软件工程作业02
    2020软件工程作业01
    2020软件工程个人作业06——软件工程实践总结作业
  • 原文地址:https://www.cnblogs.com/kuku/p/6368026.html
Copyright © 2011-2022 走看看