Cách sử dụng trình tối ưu hóa RequireJS trong khung chơi?

Question

Như quảng cáo, các rjs trong Chơi thể

đảm bảo rằng bất kỳ tài nguyên JavaScript tham chiếu từ bên trong một WebJar sẽ tự động được tham chiếu từ jsdelivr CDN. Ngoài ra, nếu tìm thấy bất kỳ tệp nào .min.js thì tệp đó sẽ được sử dụng thay cho .js. An thêm tiền thưởng ở đây là không có thay đổi cần thiết cho html của bạn!

Tuy nhiên, tôi dường như không nhận được bất kỳ thứ gì để hoạt động.

1. Tôi đã thử chạy ứng dụng Play ở chế độ sản xuất và tất cả các javascripts webjar của tôi vẫn đang được tham chiếu là cục bộ.
2. Tôi không thấy phiên bản của các tệp javascript đang được sử dụng trong sản xuất .min.

3. Tôi không thể tiêm phụ thuộc để hoạt động ở chế độ sản xuất. Ví dụ, khi tôi muốn tiêm jquery trong mã của tôi như thế này

   xác định ([ 'jquery'], function ($) { 'sử dụng nghiêm ngặt.'; console.log ($ grep); trở lại { tổng: hàm (a, b) { trả lại + b; } }; });

tôi có thể có được điều này để làm việc tốt trong chế độ dev, nhưng trong chế độ sản xuất, rjs thất bại nói

[info] Error: ENOENT, no such file or directory '/Users/khanguyen/Desktop/rjsdemo/target/web/rjs/build/js/jquery.js' 
[info] In module tree: 
[info]  main 
[info]  app 
[info] 
[info] Error: Error: ENOENT, no such file or directory '/Users/khanguyen/Desktop/rjsdemo/target/web/rjs/build/js/jquery.js' 
[info] In module tree: 
[info]  main 
[info]  app 
[info] 
[info]  at Error (native) 

Rõ ràng nó đang nhìn sai vị trí cho jQuery, mặc dù thiết lập cấu hình được tạo ra của Webjar

requirejs.config({"paths":{"jquery":["/webjars/jquery/1.11.1/jquery","jquery"]},"shim":{"jquery":{"exports":"$"}},"packages":[]}) } 

để có vị trí chính xác cho jquery.

Tôi đang sử dụng Play 2.4.0, với thiết lập pipelineStages := Seq(rjs, digest) trong build.sbt của tôi.

Vui lòng cho tôi biết nơi tôi đã nhận sai.

Cảm ơn!

Answer 1

Hóa ra yêu cầu hỗ trợ tối ưu hóa RequireJS không áp dụng cho tất cả các Webjars, mà chỉ giới hạn ở các Webjars cổ điển.

Thậm chí, tệp xây dựng webjar phải được bao gồm trong mô-đun thông thường để rj hoạt động.

Nếu bạn xem xét webjar cổ điển của jQuery, ví dụ, bạn sẽ thấy hướng dẫn xây dựng webjar đặc biệt được bao gồm. Hãy xem tập tin đó để biết thông tin của bạn.

Khi bạn đã xác định một webjar được RequireJS sẵn sàng, bạn có thể để sbt-rjs thực hiện điều đó.Đây là thiết lập của tôi để tham khảo:

/** javascripts/main.js **/ 
'use strict'; 

requirejs.config({ 
    paths:{ 
     'jquery': ['../lib/jquery/jquery'], 
     'react': ['../lib/react/react'], 
     'bootstrap': ['../lib/bootstrap/js/bootstrap'], 
     'react-bootstrap': ['../lib/react-bootstrap/react-bootstrap'] 
    }, 
    shim: { 
     'bootstrap': { 
      deps: ['jquery'] 
     }, 
     'react-bootstrap': { 
      deps: ['react'] 
     } 
    } 
}); 

Nhớ có dấu ngoặc vuông, nếu không thay thế CDN sẽ không xảy ra.

Đối với các tập lệnh chưa sẵn sàng, bạn không nên có dấu ngoặc vuông khi khai báo paths. Nếu không, rjs sẽ từ chối xây dựng với lỗi path fallback not supported. Tất nhiên, bạn sẽ không nhận được lợi ích CDN. Chỉ cần một lưu ý phụ, RequireJS css tối ưu hóa các công trình, quá. Nhưng chỉ giới hạn trong nội tuyến css, giống như các Requirejs thông thường.