📅  最后修改于: 2020-10-20 05:01:43             🧑  作者: Mango
RequireJS包含一小组插件,这些插件允许加载各种类型的资源作为依赖项。以下是RequireJS中可用插件的列表-
文本插件用于异步加载基于文本的资源,该插件主要用于在JavaScript文件中插入HTML内容。使用文本时可以加载它!在任何require或define模块调用中添加前缀,然后将文件扩展名传递给插件。与普通模块加载相比,文本插件使用XHR加载模块,并且不会将代码作为脚本标签添加到标头中。
文本文件资源可以作为依赖项包含在代码中,如下所示:
require(["mymodule", "text!mymodule.html", "text!mymodule.css"],
function(mymodule, html, css) {
//the html and css variables will be the text
//of the mymodule.html file and mymodule.css files respectively
}
);
仅在脚本完全加载后,RequireJS才能在DOM准备就绪之前用于加载脚本,并且开发人员可以与DOM交互。有时,可以在DOM准备就绪之前加载脚本。因此,为克服此问题,RequireJS提供了一种称为DOMContentLoaded事件的现代方法,一旦DOM准备就绪,该方法便会调用domReady函数。
require(['domReady'], function(domReady) {
domReady(function() {
//the domReady function is called when DOM is ready
//which is safe to manipulate DOM nodes in this function
});
});
它可以与提供i18n捆绑软件支持的多个语言环境一起使用,当模块或依赖项指定“ i18n!”时,这些语言环境将自动加载。字首。要使用此功能,请下载它并将其放在存在您的主要JavaScript文件的相同目录中。将此插件放在名为“ nls”的目录中,以找到您的本地化文件。
例如,假设我们有一个名为country.js的js文件,其内容如下,并将其放在mydirectory / nls / country.js目录中-
define({
"root": {
"india": "india",
"australia": "australia",
"england": "england"
}
});
您可以使用fr-fr区域设置将特定翻译添加到文件中,并且上面的代码将更改为-
define({
"root": {
"title": "title",
"header": "header",
"description": "description"
},
"es-es": true
});
接下来,在mydirectory / nls / es-es / country.js中指定文件,其内容如下:
define({
"root": {
"title": "título",
"header": "cabecera",
"description": "descripción"
},
"es-es": true
});
您可以通过在main.js文件中的模块config的帮助下将语言环境传递给插件来进行设置,如下所示-
requirejs.config({
config: {
//set the config for the i18n plugin
i18n: {
locale: 'es-es'
}
}
});
您可以使用一些插件来加载CSS文件,只需将其附加到标题链接即可加载CSS文件。
可以使用您自己的函数来加载CSS,如下所示-
function myCss(url) {
var mylink = document.createElement("mylink");
mylink.type = "text/css";
mylink.rel = "stylesheet";
mylink.href = url;
document.getElementsByTagName("head")[0].appendChild(mylink);
}