Usage-1.1加载JavaScript文件

RequireJS采用与传统的

或者,你可以手动地在RequireJS config当中设置。如果没有显式的配置文件以及data-main被使用,那么基URL将默认为运行RequireJS的文档所在的目录。

RequireJS同时也假设默认情况下所有的依赖都是脚本文件,因此,你不需要在模块ID上加上.js后缀。RequireJS在将模块ID转换为路径时,自动为其加上默认扩展名。通过使用paths config,你可以建立起一组脚本文件的位置。所有的这些功能使得你输入地更少。

可能有些时候你想直接引用一个脚本文件,而不遵循“baseURL+paths”。如果一个模块ID中有一下的字符之一的,该ID将不会使用“baseURL+paths”配置来传递,仅仅将其视为普通的URL:

  • 以“.js”结尾
  • 以“/”开头
  • 包含一个URL协议,例如“http:”、“https”

一般情况下,最好使用基URL以及“paths”配置来为模块ID设立路径。通过这样做,今后你在重命名以及为优化版本配置不同的路径时,将更加的灵活方便。

相似地,为了避免一连串连锁配置,最好避免为脚本设置过深的目录,而是采用基Url,或者你想通过将你的应用代码与库代码或者是组建代码分隔开来,你可以使用以下目录布局:

www/
  |--- index.html
  |--- js/
    |--- app/
      |---sub.js
    |--- lib/
      |--- jquery.js
      |--- canvas.js
    |--- app.js
    |--- require.js

在index.html中:

在app.js中:

requirejs.config({ //默认情况下会在js/lib目录下加载任何模块ID baseUrl:'js/lib', //除非模块ID使用‘‘app’’开头,从js/app目录中加载它。 //路径配置是相对于基Url,而且不会包含任何的扩展 //名'.js',因为路径配置是为了目录 path:{ app:'.../app' } }); //主要应用逻辑开始 requirejs(['jquery','canvas','app/sub'], function($, canvas, sub){ //jQuery, canvas and the app/sub模块全部能被加载并能在此被使用 });

作为示例的一部分,这些组件库,例如jQuery在它们的文件名当中都没有出现版本数字。如果你想追踪版本,我们推荐将版本信息保存在单独的文本文件中,或者你可以使用像volo这类工具,这类工具将会建立起一个保存有版本信息的package.json文件在硬盘上。这样你就可以进行非常微小的配置,而不是为每个库在配置中建立起单独的入口。例如,配置'jquery'为'jquery-1.7.2'。

理想情况下,你所加载的模块将成为模块,这些模块通过调用define()函数来定义。然而,你可能需要使用一些传统的‘浏览器全局’脚本,这些脚本不会使用define()来定义他们的依赖。出于这个目的,你可以使用shim config。该工具能够很好地表述他们的依赖。

如果你表述依赖,你很可能会遇到加载错误,因为RequireJS为了加快加载速度,将异步无序地加载脚本文件。

你可能感兴趣的:(Usage-1.1加载JavaScript文件)