Tôi đang viết mã HTML liên quan đến mã JS. Dưới đây là một ví dụ đơn giản:
<!DOCTYPE html PUBLIC > <html> <body> <h2>Use JavaScript to Change Text</h2> <p>This example writes "Hello JavaScript!" into an HTML element with id="demo":</p> <p id="demo"></p> <script> var net = require('net'); var sleep = require('sleep'); var element = document.getElementById("demo"); element.innerHTML = "Hello JavaScript!"; sleep(1) </script>Thật không may "Xin chào JavaScript!" Không xuất hiện khi tôi duyệt tệp trên bằng trình duyệt của mình. Nhìn vào bên trong bảng điều khiển gỡ lỗi, tôi có thể thấy tin nhắn folowing:
ReferenceError: require is not definedVì vậy, có vẻ như yêu cầu không được xác định bên trong mã HTML nhưng tôi đã viết một tệp Test.js nhỏ như dưới đây:
var net = require('net'); var sleep = require('sleep'); sleep.sleep(1)Và sau đó tôi chạy nó với
node test.js.Không có lỗi, mọi thứ hoạt động tốt, yêu cầu cũng có sẵn và ngủ và mạng. Tại sao mã bên trong tệp HTML không hoạt động?
Hỏi ngày 24 tháng 4 năm 2018 lúc 21:39Apr 24, 2018 at 21:39
2
JavaScript không giống như Node.js
Yêu cầu () không phải là một phần của tiêu chuẩn JavaScript và không được các trình duyệt hỗ trợ ra khỏi hộp, đó là hệ thống mô -đun Node.js.
Bạn có thể cần phải trực tiếp bao gồm các mô -đun; Một số mô -đun có thể không hoạt động trong bối cảnh hộp cát của trình duyệt.
Ngoài ra, các công cụ như //browserify.org/ có thể hữu ích.
Đã trả lời ngày 24 tháng 4 năm 2018 lúc 21:45Apr 24, 2018 at 21:45
PeterispeterisPeteris
3.1372 Huy hiệu vàng24 Huy hiệu bạc39 Huy hiệu Đồng2 gold badges24 silver badges39 bronze badges
Lý do bạn nhận được ReferenceError: require is not defined là vì không nơi nào trong trang HTML của bạn được yêu cầu bao gồm. Yêu cầu không đi kèm với thư viện JavaScript tiêu chuẩn của bạn. Bạn phải bao gồm tệp trên trang của bạn để nó có thể được tải và sử dụng.
Điều này có thể được thực hiện bằng cách thêm <script src="myJS.js"></script> vào thẻ <head> hoặc <body>. Tất nhiên, tệp ReferenceError: require is not defined 0 sẽ được thay thế bằng tệp ReferenceError: require is not defined 1.
Lý do nó hoạt động khi bạn chạy với nút là vì Node đã có trình tải mô -đun riêng.
Đã trả lời ngày 24 tháng 4 năm 2018 lúc 21:46Apr 24, 2018 at 21:46
Celacelacela
2.2403 huy hiệu vàng22 Huy hiệu bạc40 Huy hiệu đồng3 gold badges22 silver badges40 bronze badges
Thêm Yêu cầuJS § 2§ 2
Lưu ý: Để biết lời khuyên dành riêng cho jquery, hãy xem trang Tích hợp JQuery
Thiết lập này giả định bạn giữ tất cả các tệp JavaScript của mình trong thư mục "tập lệnh" trong dự án của bạn. Ví dụ: nếu bạn có một dự án có trang dự án.html, với một số tập lệnh, bố cục thư mục có thể trông giống như vậy:
- định hướng dự án/
- Dự án.html
- kịch bản/
- main.js
- người giúp đỡ/
- util.js
Thêm yêu cầu.js vào thư mục Script, vì vậy có vẻ như vậy:
- định hướng dự án/
- project.html
- kịch bản/
- main.js
- require.js
- người giúp đỡ/
- util.js
Thêm yêu cầu.js vào thư mục Script, vì vậy có vẻ như vậy:
<!DOCTYPE html> <html> <head> <title>My Sample Project</title> <!-- data-main attribute tells require.js to load scripts/main.js after require.js loads. --> <script data-main="scripts/main" src="scripts/require.js"></script> </head> <body> <h2>My Sample Project</h2> </body> </html>Để tận dụng tối đa công cụ tối ưu hóa, bạn nên giữ tất cả các tập lệnh nội tuyến ra khỏi HTML và chỉ tham chiếu yêu cầu.
Bạn cũng có thể đặt đầu thẻ script của phần của phần nếu bạn không muốn tải tập lệnh yêu cầu.js để chặn kết xuất. Đối với các trình duyệt hỗ trợ nó, bạn cũng có thể thêm một thuộc tính async vào thẻ tập lệnh.
requirejs(["helper/util"], function(util) { //This function is called when scripts/helper/util.js is loaded. //If util.js calls define(), then this function is not fired until //util's dependencies have loaded, and the util argument will hold //the module value for "helper/util". });Bên trong main.js, bạn có thể sử dụng requestjs () để tải bất kỳ tập lệnh nào khác bạn cần chạy. Điều này đảm bảo một điểm nhập duy nhất, vì tập lệnh dữ liệu chính mà bạn chỉ định được tải không đồng bộ.
Điều đó sẽ tải tập lệnh trợ giúp/Util.js. Để có được toàn bộ lợi thế của các yêu cầu, hãy xem các tài liệu API để tìm hiểu thêm về việc xác định và sử dụng các mô -đun.§ 3
Tối ưu hóa § 3