Làm cách nào để biên dịch một phần mở rộng của Google Chrome ra khỏi mã mà tôi tìm thấy tại userscripts.org?

Question

Tôi đã xem qua this userscript hoạt động trong Google Chrome.

Tôi muốn sử dụng nó làm tiện ích mở rộng của Google Chrome vì điều này sẽ cho tôi trải nghiệm chuyển đổi nhiều mã khác từ userscripts sang Google Chrome Extensions.

Ai đó có thể cho tôi hướng dẫn từng bước về cách tạo Tiện ích mở rộng của Google Chrome trong số this userscript code?

// ==UserScript== 
// @name   Facebook Ads Hider 
// @author   Jose Luis Martin 
// @namespace  http://joseluismartin.info 
// @description Hide Ads on Facebook 
// @include  http://www.facebook.com/* 
// @run-at   document-start 
// 
// ==/UserScript== 

if (document.addEventListener) { 
    document.addEventListener("DOMNodeInserted", onNodeInserted, false); 
} 

// Event listener to hide ads containers 
function onNodeInserted(event) { 
    target = event.target; 
    if (target.className == "ego_column") { 
     hideElement(target); 
    } 
} 

// trivial hide of ads container 
function hideElement(elto) { 
    elto.style.visibility = "hidden"; 
    elto.style.hight = "0px"; 
    elto.style.width = "0px"; 
} 

Vui lòng không trả lời rằng không cần thiết vì người dùng có thể tự chạy trên Google Chrome. Tôi đang làm điều này để tìm hiểu cách tạo tiện ích Google Chrome.

The Google Chrome extension tutorial rất xấu cho sự hiểu biết và khiến tôi nôn mửa - Tôi không biết ai đã tạo ra nó!

Answer 1

Trong Google Chrome, người dùng có mã số là tiện ích mở rộng. Tập lệnh được đóng gói dưới dạng content script và tiện ích mở rộng manifest.json được tạo tự động.

Để di chuyển hướng tới một "đầy đủ" mở rộng:

1. đầu tiên tổ chức kịch bản của bạn, tập tin nguồn (s) và rõ ràng tạo manifest.json như trong this answer.

2. Bạn không cần phải thay đổi mã của UserScript rằng, vào thời điểm này, nhưng bạn sẽ muốn chuyển các giá trị của @include và @run-at chỉ thị cho manifest.json tập tin bạn sẽ tạo ra. Tham khảo ví dụ trong câu trả lời được liên kết đó.

3. đọc the Content Scripts page và lưu ý cách biểu hiện có thể được sử dụng để dễ dàng thêm CSS, jQuery, UserScript bạn (Nội dung AKA script) vv

4. Nội dung kịch bản là 1 trong 3 công cụ chính có sẵn cho Tiện ích mở rộng của Chrome. Hai trang còn lại là các trang nền và giao diện người dùng. Tìm hiểu thêm về những người bắt đầu với the extension-development Overview.

5. Cuối cùng, bạn có thể đóng gói tiện ích của mình như được giải thích trong this answer.