2015-10-09 18 views
15

Tôi đang cố gắng chọn trình duyệt và đã trải qua một số ví dụ.Trình duyệt nhập/yêu cầu?

Trong một ví dụ tôi thấy việc sử dụng các 'nhập khẩu':

import 'jquery'; 

và nhập khẩu các tập tin địa phương với:

import Header from './Header'; 

nhưng trong ví dụ khác tôi thấy người nhập khẩu qua:

require('./Header'); 

Sự khác biệt là gì?

Trả lời

21

require() là hệ thống mô-đun nút (CommonJS) trong ES5. import là cú pháp mô-đun ES6.

Nếu bạn muốn duyệt các mô-đun được viết bằng cú pháp mô-đun ES6, bạn sẽ cần phải biên dịch chúng bằng cách sử dụng một cái gì đó như babelify (hoặc babel bằng các phương tiện khác).

+1

Cảm ơn thông tin. – panthro

+2

Không chắc tôi hiểu. Tại sao tôi cần 'browserify' (hoặc' require' cho vấn đề đó) nếu tôi transpile ES6 qua Babel? Điều đó không dịch các câu lệnh 'import' thành một môi trường JS cũ hơn có hiểu không? – Matthias

+4

@Matthias pre-ES6 không có hệ thống mô-đun gốc, do đó, có nhiều hệ thống được xây dựng trong mã người dùng (ví dụ: mô-đun CommonJS/Node và AMD). 'require()' là một phần của API mô đun nút. Vì vậy, đó là một trong những "thứ gì đó cũ hơn trong môi trường JS hiểu" các mục tiêu bạn có thể biên dịch (sẽ chạy trong Node). Tuy nhiên, các trình duyệt không có kiến ​​thức về các API đó. Nút thực hiện nó bằng cách gói các mô-đun trong một hàm chèn 'require()' vv Trong trình duyệt 'require()' sẽ chỉ là một lỗi tham chiếu. Browserify làm cho nó hoạt động trong trình duyệt và gói toàn bộ biểu đồ phụ thuộc vào một tập lệnh duy nhất. – JMM

Các vấn đề liên quan