只需2分钟即可设置Require.js。 或下载下面的代码并使其正常运行。

在GitHub上查看项目

什么是Require.js？

RequireJS是一个JavaScript文件和模块加载器。 它针对浏览器内使用进行了优化，但可以在其他JavaScript环境中使用，例如Rhino和Node。 使用像RequireJS这样的模块化脚本加载器将提高代码的速度和质量。

它行得通吗？

是。 下面的屏幕截图来自我的开发人员，其chrome开发人员工具处于打开状态（禁用缓存），因此速度自然很快，但即使在这里您也可以看到性能提高，这令人惊讶。

Web App结构

这是可用于Web应用程序的非常基本的结构。

• 根/
  • index.html
  • js
    • 供应商
      • [外部JavaScript文件和jQuery插件]
    • 应用程式
      • main.js
      • [您的模块和Web应用程序JavaScript文件]
    • app.js
  • 的CSS
  • img

HTML之前：

加载脚本的常规方法是…Modernizr放在头上，其余部分放在体内。

< !DOCTYPE html>rel="stylesheet" href="app/css/main.css"/>

HTML之后：

Require.js放在首位。 干净利落。

 < !DOCTYPE html>  rel="stylesheet" href="app/css/main.css"/>  

app.js

该文件包含require.js的配置。 如果更改目录结构，则需要匹配。 我正在向您展示shim版本，您还可以从CDN加载jQuery 。

// Place third party dependencies in the lib folder
//
// Configure loading modules from the lib directory,
requirejs.config({"baseUrl": "js/vendor","paths": {"app": "../app"},"shim": {"backbone": ["jquery", "underscore"],"bootstrap": ["jquery"]}
});// Load the main app module to start the app
requirejs(["app/main"]);

main.js

该文件包含Web应用程序的依赖关系，一旦加载，您就可以使用任何喜欢的框架（例如Backbone或Angular）启动应用程序。

//Load Web App JavaScript Dependencies/Plugins
define(["jquery","modernizr","underscore","backbone","bootstrap"
], function($)
{$(function(){//do stuffconsole.log('required plugins loaded...');});
});

还是不能正常工作？

下载代码

From: https://www.sitepoint.com/require-js-setup-time-2-minutes/