RequestJS - Plugin

RequestJS chứa một tập hợp nhỏ các plugin cho phép tải nhiều loại tài nguyên khác nhau dưới dạng phụ thuộc. Sau đây là danh sách các plugin có sẵn trong RequestJS -

text
domReady
i18n
Tải CSS

bản văn

Trình cắm văn bản được sử dụng để tải không đồng bộ các tài nguyên dựa trên văn bản, chủ yếu được sử dụng để chèn nội dung HTML trong các tệp JavaScript. Nó có thể được tải khi bạn sử dụng văn bản! tiền tố trong bất kỳ lệnh gọi mô-đun yêu cầu hoặc xác định nào và chuyển phần mở rộng tệp vào trình cắm thêm. So với tải mô-đun thông thường, trình cắm văn bản tải mô-đun bằng XHR và sẽ không thêm mã vào tiêu đề dưới dạngscript nhãn.

Tài nguyên tệp văn bản có thể được bao gồm dưới dạng phụ thuộc trong mã như:

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
   }
);

domReady

Yêu cầu có thể được sử dụng để tải các tập lệnh trước khi DOM sẵn sàng và các nhà phát triển có thể tương tác với DOM, chỉ khi các tập lệnh tải hoàn toàn. Đôi khi các tập lệnh có thể được tải trước khi DOM sẵn sàng. Vì vậy, để khắc phục vấn đề này, RequiJS cung cấp cách tiếp cận hiện đại được gọi là sự kiện DOMContentLoaded gọi hàm domReady khi DOM đã sẵn sàng.

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

Nó có thể được sử dụng với nhiều ngôn ngữ cung cấp i18nhỗ trợ gói sẽ được tải tự động khi một mô-đun hoặc phần phụ thuộc chỉ định "i18n!" tiếp đầu ngữ. Để sử dụng điều này, hãy tải xuống và đặt nó vào cùng thư mục nơi có tệp JavaScript chính của bạn. Đặt plugin này trong thư mục có tên "nls" để định vị các tệp bản địa hóa của bạn.

Ví dụ: giả sử rằng chúng ta có một tệp js được gọi là country.js với nội dung sau và đặt nó vào thư mục dưới dạng mydirectory / nls / country.js -

define({
   
   "root": {
      "india": "india",
      "australia": "australia",
      "england": "england"
   }
});

Bạn có thể thêm bản dịch cụ thể vào một tệp bằng cách sử dụng ngôn ngữ fr-fr và mã trên sẽ thay đổi thành:

define({
   
   "root": {
      "title": "title",
      "header": "header",
      "description": "description"
   },
   
   "es-es": true
});

Tiếp theo, chỉ định tệp tại mydirectory / nls / es-es / country.js với nội dung sau:

define({
   
   "root": {
      "title": "título",
      "header": "cabecera",
      "description": "descripción"
   },
   
   "es-es": true
});

Bạn có thể đặt ngôn ngữ bằng cách chuyển nó vào plugin với sự trợ giúp của cấu hình mô-đun trong tệp main.js như hình dưới đây -

requirejs.config({
   
   config: {
      //set the config for the i18n plugin
      
      i18n: {
         locale: 'es-es'
      }
      
   }
});

Tải CSS bằng RequestJS

Bạn có thể sử dụng một số plugin để tải tệp CSS bằng cách chỉ cần thêm vào liên kết tiêu đề để tải tệp CSS.

CSS có thể được tải bằng cách sử dụng chức năng của riêng bạn như hình dưới đây -

function myCss(url) {
   var mylink = document.createElement("mylink");
   mylink.type = "text/css";
   mylink.rel = "stylesheet";
   mylink.href = url;
   document.getElementsByTagName("head")[0].appendChild(mylink);
}