2013-07-18 17 views
11

Làm việc với máy phát điện yeoman-góc cạnh, nó giả định rằng bạn muốn đặt các tệp css và tập lệnh trong cùng một máy chủ với tệp index.html của bạn. Nó tạo ra một tập tin dist/index.html trông giống như:Có bất kỳ công việc [grunt] tự động nào để thêm CDN vào các tệp CSS/JS bên trong index.html của bạn không?

<link rel="stylesheet" href="styles/7d151330.main.css"> 
<script src="scripts/6f9c9a13.scripts.js"></script> 
<script src="scripts/bd6ce9e3.plugins.js"></script> 
<script src="scripts/ec88f033.modules.js"></script> 

Tuy nhiên, tôi muốn để lưu trữ các tập tin CSS/JS trên một máy chủ khác nhau và thêm vào phía trước với URL:

<link rel="stylesheet" href="//mycdn.com/styles/7d151330.main.css"> 
<script src="//mycdn.com/scripts/6f9c9a13.scripts.js"></script> 
<script src="//mycdn.com/scripts/bd6ce9e3.plugins.js"></script> 
<script src="//mycdn.com/scripts/ec88f033.modules.js"></script> 

Tôi tin rằng đây là thực hành tốt nhất của YSLOW và trên thực tế đang được sử dụng bởi trang stackoverflow mà bạn đang xem (xem mã nguồn để xem ghi chú của họ trên https://cdn.sstatic.net/) Có các CDN khác nhau dường như không khả thi với plugin grunt-google-cdn

Suy nghĩ hiện tại của tôi là thực hiện tìm kiếm và chèn vào:

<script src="[INSERTHERE]scripts/ 
<link rel="stylesheet" href="[INSERTHERE]styles/ 

CẬP NHẬT: Có một số plugin grunt thực hiện tìm kiếm/thay thế nên đây có thể là tuyến đường tốt nhất.

Bất kỳ đề xuất bổ sung nào để nhận url CDN được thêm vào trong quá trình xây dựng grunt?

Trả lời

0

này không được công việc https://www.npmjs.org/package/grunt-cdnify Đối với trường hợp sử dụng tiêu chuẩn, chỉ cần thiết lập một chuỗi căn cứ cho các URL của bạn - ví dụ: '//cdn.example.com/'. Tác vụ cdnify sẽ tự động tìm kiếm tất cả các URL cục bộ trong các tệp của bạn và đặt tiền tố cho chúng bằng chuỗi này. (Nó sẽ tự động tránh thêm các dấu gạch chéo kép.)

0

Để có mục đích chung hơn là "CDNize", bạn có thể sử dụng mô-đun tiền xử lý cho phép bạn xử lý trước các tệp nguồn của bạn (html và khác).

Với điều này bạn có thể xây dựng các file nguồn phụ thuộc vào bất kỳ biến .. như URL khác nhau bởi môi trường, mã DEBUG cho biết thêm, vv ...

biết thêm thông tin ở đây: https://github.com/jsoverson/grunt-preprocess

ps: xem một một câu trả lời có liên quan khác của tôi tại đây: How to set AngularjJS base URL dynamically based on fetched environment variable?

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