如何在requirejs中包含第三方脚本 [英] How to include 3rd party scripts with requirejs

问题描述

我正在尝试处理AMD的方式，我的选择落在requirejs上.在此项目中，我使用MDL(前端框架；对于那些尚未听说过的人，将其视为引导程序3)，应将其包括为:

I'm trying out AMD-way of handling scipts and my choise fell upon requirejs. In this project I use MDL (front-end framework; for those who haven't heard of it think of it as bootstrap 3) which should be included as:

<link rel="stylesheet" href="/bower_components/material-design-lite/material.min.css">
<script src="/bower_components/material-design-lite/material.min.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

我对这个框架提供的js API并不感兴趣(如果有的话)，当我将特定于framwerk的类附加到元素上时，我只需要此脚本才能使UI正常工作.

I am not interested in js API that this framework is providing (if it provides any), I need this script only for UI to work properly when I attach framwerk-specific classes to elements.

根据requirejs的原理，我只需要在页面上的script标记中包含一个脚本文件-入口点.我了解在该主脚本中，我需要要求依赖项.如果说的是jQuery或下划线，即我实际上需要并且我的代码依赖的库，我会写类似的东西:

According to requirejs philosophy I need only one script file to be included with a script tag on my page - the entry point. I understand that in that main script I need to require dependencies. And if it was say jQuery or underscore i.e. the library I actually require and my code depends on, I would write something like:

require(
    ['jquery'],
     function($) {
        $('body').append(...);
    }
);

但是，如果它不是一个实际的依赖项，但是我仍然需要将其加载到我的页面中，那么我该如何滚动；在这种特殊情况下，我需要先加载它.

But how do I roll if it's not an actual dependency but I still need it to be loaded in my page and, in this particular case, I need it to be loaded first.

我该怎么办?我的猜测是我从head中删除了script标记，并在入口点脚本中将其指定在方括号中(就像我在上面的代码段中对jquery所做的那样)，但是只是不使用它.正确吗?

What do I do? My guess is I remove the script tag from my head and specify it in square brackets in my entry point script (as I did for jquery in snippet above) but just don't use it. Is it correct?

推荐答案

但是如果它不是一个实际的依赖项，但是我仍然需要将其加载到我的页面中，并且在这种特殊情况下，我需要先加载它，该如何滚动.

But how do I roll if it's not an actual dependency but I still need it to be loaded in my page and, in this particular case, I need it to be loaded first.

RequireJS仅保证模块加载的相对顺序.如果必须绝对先加载模块，则依赖关系链必须使得其他所有内容都直接或间接依赖于该模块. RequireJS没有提供一种说先加载此文件"的方法.您只能通过依赖项来获得此效果. (有时人们认为deps配置选项可以保证某些模块将首先加载.它不会.或者他们认为require或define调用中的依赖顺序设置了加载 beyond <的顺序./em>设置的依赖项，但没有.如果A和B没有自己的依赖项，则require(['A', 'B'], ...和require['B', 'A'], ...都可以自由以任何顺序加载模块.)

RequireJS only guarantees the relative order in which modules are loaded. If a module must absolutely be loaded first, then the chain of dependencies must be such that everything else depends on it, directly or indirectly. RequireJS does not provide a method to say "load this before everything else". You can get this effect only through dependencies. (Sometimes people think the deps configuration option guarantees that some modules will load first. It does not. Or they think that the order of dependencies in a require or define call sets an order for loading beyond what the dependencies set. It does not. If A and B have no dependencies of their own then require(['A', 'B'], ... and require['B', 'A'], ... are both free to load the modules in any order.)

我该怎么办?我的猜测是我从脑海中删除了script标记，并在入口点脚本中将其指定在方括号中(就像我在上面的代码段中对jquery所做的那样)，但是只是不使用它.正确吗?

What do I do? My guess is I remove the script tag from my head and specify it in square brackets in my entry point script (as I did for jquery in snippet above) but just don't use it. Is it correct?

理论上，这样做没有问题.我之所以说理论上"，是因为我不使用MDL，所以我不知道MDL是否有任何需要阻止其工作的需求.您已将MDL与Bootstrap 3进行了比较.您所描述的是如何使用RequireJS加载Bootstrap.我倾向于使用CommonJS惯用语，因此需要Bootstrap的模块如下所示:

In theory there's no problem with doing this. I say "in theory" because I do not use MDL so I don't know if MDL has any need that would prevent it from working. You've compared MDL with Bootstrap 3. What you describe is how I load Bootstrap with RequireJS. I tend to use the CommonJS idiom so modules that need Bootstrap look something like this:

define(function (require, exports, module) {
'use strict';

require("bootstrap");

无需执行var bootstrap = require("bootstrap");之类的操作，因为无论如何该值都将为undefined，因为Bootstrap的JS代码会将其自身安装为jQuery插件.

There's no need to do something like var bootstrap = require("bootstrap"); because the value would be undefined anyway because the JS code of Bootstrap installs itself as jQuery plugins.

这篇关于如何在requirejs中包含第三方脚本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！