Aurelia - Cấu hình
Trong chương này, chúng tôi sẽ chỉ cho bạn cách cấu hình khung Aurelia cho nhu cầu của bạn. Đôi khi bạn cần đặt cấu hình ban đầu hoặc chạy một số mã trước khi ứng dụng được hiển thị cho người dùng.
Bước 1 - Tạo main.js
Hãy tạo main.js tập tin bên trong srcthư mục. Bên trong tệp này, chúng tôi sẽ cấu hình Aurelia.
Bạn cũng cần yêu cầu Aurelia tải mô-đun cấu hình. Bạn có thể xem phần được nhận xét trong ví dụ sau.
index.html
<!DOCTYPE html>
<html>
<head>
<title>Aurelia</title>
<link rel = "stylesheet" href = "styles/styles.css">
<meta name = "viewport" content = "width=device-width, initial-scale = 1">
</head>
<body aurelia-app = "main">
<!--Add "main" value to "aurelia-app" attribute... -->
<script src = "jspm_packages/system.js"></script>
<script src = "config.js"></script>
<script>
SystemJS.import('aurelia-bootstrapper');
</script>
</body>
</html>Bước 2 - Cấu hình mặc định
Đoạn mã dưới đây cho thấy cách sử dụng cấu hình mặc định. configurechức năng cho phép thiết lập cấu hình bằng tay. Chúng tôi đang thiết lậpuse tài sản để chỉ định những gì chúng tôi cần.
main.js
export function configure(aurelia) {
aurelia.use
.standardConfiguration()
.developmentLogging();
aurelia.start().then(() => aurelia.setRoot());
}Bước 3 - Cấu hình nâng cao
Có rất nhiều tùy chọn cấu hình mà chúng tôi có thể sử dụng. Nó nằm ngoài phạm vi của bài viết này để cho bạn thấy tất cả, vì vậy chúng tôi sẽ giải thích cách cấu hình hoạt động trên ví dụ sau. Về cơ bản chúng tôi đang bảo Aurelia sử dụngdefault data binding language, default resources, development logging, router, history và event aggregator. Đây là bộ plugin tiêu chuẩn.
export function configure(aurelia) {
aurelia.use
.defaultBindingLanguage()
.defaultResources()
.developmentLogging()
.router()
.history()
.eventAggregator();
aurelia.start().then(() => aurelia.setRoot());
}Note - Các cài đặt này sẽ được giải thích chi tiết trong chương tiếp theo.