nén các tệp .js và .css khi đẩy trang web

Question

Tôi thậm chí không chắc chắn nếu có điều gì tôi muốn là có thể, vì vậy tôi yêu cầu các bạn chỉ cho tôi biết nếu có ai đó làm điều đó trước đây. Vì vậy, mục tiêu của tôi là khi tôi nhấp vào "Xuất bản" trang web trong VS2010, để có tất cả các tệp javascript được nén thành một, cùng với css và sau đó trong tệp bố cục của tôi thay đổi tham chiếu từ tất cả các tệp js và css khác nhau những người. Đó có phải là doable? Hoặc có thể là doable nhưng theo cách thủ công hơn? Tất nhiên mục tiêu ở đây là chỉ có hai cuộc gọi đến các tệp bên ngoài trên trang web, nhưng khi tôi phát triển, tôi cần xem tất cả các tệp để tôi có thể thực sự làm việc với nó. Tôi đoán tôi có thể làm điều đó bằng tay trước mỗi lần đẩy, nhưng tôi muốn nó được thực hiện tự động bằng cách sử dụng một số kịch bản hoặc một cái gì đó. Tôi đã không thử bất cứ điều gì được nêu ra, và tôi không tìm kiếm giải pháp đã sẵn sàng, tôi chỉ tìm cách để có được để biết vấn đề tốt hơn và có thể một số lời khuyên.

Cảm ơn rất nhiều!

Answer 1

Điều này được tích hợp vào ASP.net 4.5. Nhưng trong thời gian trung bình, bạn nên nhìn vào các dự án sau

• YUI Compressor
  • Mục tiêu của dự án này là để nén bất kỳ Sheets Javascript và Cascading Style đến một mức độ hiệu quả mà hoạt động chính xác như là nguồn gốc , trước khi nó được rút ngắn.
• Cassette
  • Cassette tự động sắp xếp, móc nối, minifies, cache và các phiên bản tất cả JavaScript, CoffeeScript, CSS, LESS và các mẫu HTML.
• RequestReduce
  • Super Simple Auto gộp nhóm, việc rút gọn và Đóng bó giải pháp
  • Không cần phải nói RequestReduce nơi nguồn lực của bạn là
  • CSS và Javascript của bạn có thể ở bất cứ đâu - thậm chí trên một máy chủ bên ngoài
  • Yêu cầuBắt đầu tìm thấy chúng trong thời gian chạy tự động
• SquishIt
  • SquishIt cho phép bạn squish một số JavaScript và CSS. Và cũng có một số LESS và CoffeeScript.
• Combres
  • NET thư viện cho phép việc rút gọn, nén, kết hợp, và bộ nhớ đệm của JavaScript và tài nguyên CSS cho ASP.NET và ASP.NET MVC ứng dụng web. Nói một cách đơn giản, nó giúp các ứng dụng của bạn xếp hạng tốt hơn với YSlow và PageSpeed.
• Chirpy
  • Mashes, minifies, và xác nhận javascript, kiểu, và các tập tin dotless của bạn. Chirpy cũng có thể tự động cập nhật T4MVC và các mẫu T4 khác.

Scott Hanselman viết a good overview blog post về chủ đề này trong một thời gian trở lại.

Answer 2

Hãy xem YUI compressor @ codeplex.com điều này có thể thực sự hữu ích.

Answer 3

Điều tôi đã làm trước đây là thiết lập post-build event, để nó chạy một tệp lô đơn giản giúp giảm thiểu tệp nguồn của bạn. Sau đó, nếu bạn đang ở chế độ phát hành (không ở chế độ gỡ lỗi), bạn sẽ tham khảo các tệp nguồn được thu nhỏ. http://www.west-wind.com/weblog/posts/2007/Jan/19/Detecting-ASPNET-Debug-mode

Answer 4

Tôi không biết liệu có cách nào có thể bằng cách nào đó móc vào chức năng từ nút 'Xuất bản' đó hay không, nhưng chắc chắn có thể có 'quá trình xây dựng tĩnh' đó.

Cá nhân tôi đang sử dụng Apache ANT để viết chính xác những gì bạn đã mô tả ở đó. Vì vậy, bạn đang phát triển trên các tệp js/html/css không nén của bạn và khi bạn hoàn tất, bạn gọi như ant build, sau đó thu nhỏ, nén, tạo sọc và xuất bản toàn bộ ứng dụng web của bạn.

Ví dụ: https://github.com/jAndreas/typeof-NaN-2.0/blob/master/build/build.xml

Answer 5

Tôi chưa từng nghe về việc giảm thiểu xuất bản. Tôi nghĩ việc sử dụng nên chọn giữa việc giảm thiểu động lực như SquishIt hoặc biên dịch thời gian như YuiCompressor hoặc AjaxMinifier.

Tôi thích thời gian biên dịch hơn. Tôi không nghĩ rằng nó rất quan trọng để phải biên dịch các tập tin thay đổi thời gian. Nếu bạn có các dòng mã css/js lớn, bạn có thể chọn hành động này chỉ để biên dịch phát hành và nếu nó giúp xuất bản các tệp này chỉ trong các cinfigurations xây dựng cần thiết.

Answer 6

Tôi đã bỏ phiếu cho câu trả lời đã đề cập đến Cassette nhưng tôi sẽ nêu chi tiết lựa chọn cụ thể đó nhiều hơn một chút. Cassette là khá cấu hình, nhưng dưới sự lựa chọn phổ biến nhất, nó cho phép bạn để tham khảo tài nguyên CSS và Javascript qua cú pháp như thế này:

Bundles.Reference("Scripts/aFolderOfScriptsThatNeedsToLoadFirst", "first"); 
Bundles.Reference("Scripts/aFolderOfScripts"); 
Bundles.Reference("Styles/aFolderOfStyles"); 

Sau đó bạn sẽ làm cho những trong tổng thể hoặc bố trí của bạn trang như thế này:

Trong quá trình phát triển, tập lệnh và kiểu của bạn sẽ được bao gồm dưới dạng tệp riêng lẻ và Cassette sẽ cố gắng giúp bạn bằng cách phát hiện thay đổi và cố gắng làm cho trình duyệt tải lại các tệp đó. Cách tiếp cận này là rất tốt để gỡ lỗi vào các thư viện như loại trực tiếp khi họ đang làm điều gì đó bạn không mong đợi. Và, phần hay nhất, khi bạn khởi động trang web, bạn chỉ cần thay đổi web.config và Cassette sẽ rút gọn và gộp tất cả các tệp của bạn thành một vài nhóm nhất có thể.

Bạn có thể tìm thêm chi tiết trong tài liệu của họ (đó là khá tốt mặc dù đôi khi bị tụt hậu phát triển): http://getcassette.net/documentation/getting-started