2013-03-18 27 views
6

Tôi có một ứng dụng internet mvc4 với các khu vực, tổ chức của tôi mỗi khu vực đại diện cho SPA và thông qua "Quản lý Gói NuGet" tôi đã cài đặt "Durandal 1.2.0", "Durandal Transitions 1.2.0" và "Durandal Router 1.2.0". Tôi đã tổ chức các thư mục và thoát khỏi "lượt xem" và "chế độ xem" từ thư mục "Ứng dụng" của Durandal và đặt chế độ xem mới trong thư mục "VIews" của khu vực mvc4 ví dụ:Khu vực Durandal và MVC4 cho nhiều SPA

Khu vực -> NewArea -> Chế độ xem -> ControllerFolder -> xem -> shell.html

Sau đó, tôi đặt 'viewmodels "trong thư mục "Script" ví dụ:

Scripts -> NewArea -> ControllerFolder -> viewmodels -> shell.js

Tập lệnh -> NewArea -> ControllerFolder -> main.js

Sau đó, tôi đã thay đổi đường dẫn cho JS của Durandal, ví dụ như trong main.js:

define(['../../../App/durandal/app', 
    '../../../App/durandal/viewLocator', 
    '../../../App/durandal/system', 
    '../../../App/durandal/plugins/router', 
    '../../../App/services/logger'], 

Và tôi đã thay đổi main.js trong dòng tiếp theo:

viewLocator.useConvention('viewmodels', '../Areas/NewArea/Views/ControllerFolder/views'); 

Nhưng đó cấu hình các thư mục không thành công vì tiếp theo dòng gọi khác nhau lần so với mô-đun "viewLocator" trong định nghĩa của nó và viết lại cấu hình của "useConvention" với giá trị mặc định:

app.setRoot('viewmodels/shell', 'entrance'); 

hành vi đó chỉ xảy ra khi các thư mục "quan điểm" một d "viewmodels" không nằm trong thư mục "App" của "Durandal".

Xin hãy giúp tôi, làm thế nào để có nhiều SPA khác nhau trong cùng một dự án?

Trả lời

5

Bạn có thể muốn xem xét chiến lược triển khai của mình. Ví dụ: nếu bạn cần tối ưu hóa ứng dụng này, cả SPA sẽ kết thúc trong cùng một tệp. Tuy nhiên, thay vì có cả hai bên dưới thư mục ứng dụng, bạn có thể tạo các thư mục riêng biệt và cung cấp cho mỗi SPA tệp main.js riêng của nó.

Trong các trường hợp nâng cao hơn, bạn có thể tạo ứng dụng "bootstrapper" tải một hoặc một số SPA khác. Bootstrapper sẽ chứa mã phổ biến cho cả hai SPA. Nhưng mỗi SPA (và bootstrapper) có thể được tối ưu hóa độc lập.

Có nhiều tùy chọn. Chủ yếu, hãy xem xét chiến lược triển khai cuối cùng của bạn và điều đó sẽ giúp hướng dẫn bạn ở đây.

Ngoài ra, vấn đề bạn có ở trên có thể liên quan đến thực tế là các quy ước tiêu chuẩn có thể không hoạt động trong thiết lập của bạn và bạn cần ghi đè một số chức năng bằng ánh xạ của riêng bạn.

+1

Cảm ơn, cho đề xuất của bạn, có thể Bạn có thể cho tôi biết thêm thông tin về "bootstrapper". – kuskunko

5

Tôi đã gặp phải vấn đề tương tự vào sáng nay. Tôi ban đầu được định dạng dự án là:

  • app/spa1/viewmodels
  • app/spa1/views
  • app/spa2/viewmodels
  • app/spa2/views

Sử dụng cấu trúc này tôi nhấn chính xác bức tường giống như bạn đã làm. Sau khi đọc bài viết của bạn, tôi cơ cấu lại dự án là:

  • app/viewmodels/spa1
  • app/viewmodels/spa2
  • app/views/spa1
  • app/views/spa2

Sử dụng cấu trúc này, điều hướng hoạt động tốt. Tôi thiết lập ba SPAS và có thể điều hướng cả ba. Lợi ích khác của cấu trúc này là bạn đang theo quy ước tiêu chuẩn, do đó bạn không phải cấu hình bộ định vị khung nhìn. Chỉ cần đảm bảo tệp main.js cho từng spa sử dụng:

  • app.setRoot ('kiểu xem/spa1/shell), app.setRoot (' mô hình xem/spa2/shell), v.v.

Cuối cùng, bằng cách cấu trúc theo cách này, bạn di chuyển tệp main.js lên cấu trúc giúp loại bỏ ../../../ trong tất cả các định nghĩa của bạn.

Tôi hy vọng điều này sẽ hữu ích.

+0

Cảm ơn, bây giờ tôi đang sử dụng cấu trúc của bạn và nó hoạt động tốt. – kuskunko

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