从背景js加载Chrome扩展程序中的Angular 2应用程序

Question

我是Chrome扩展开发的新手。我正在尝试开发一个侧边栏类型扩展，我已成功地在浏览器的地址栏上单击操作按钮单击侧边栏。我正在尝试在我的script.js中加载我的一个角度2应用程序（读取事件脚本），但没有这样做。

我的清单：

{
    "name": "My extension",
    "manifest_version": 2,
    "version": "1.0.0",
    "background": {
        "page": "background.html"
    },
    "page_action": {
        "default_icon": "icon.png",
        "default_title": "My Extension"
    },
    "content_scripts": [{
        "matches": ["<all_urls>"],
        "js": ["script.js"]
    }],
    "permissions": [
        "tabs"
    ]
}

background.js：

chrome.tabs.onUpdated.addListener(function(tabId) {
    chrome.pageAction.show(tabId);
});

chrome.tabs.getSelected(null, function(tab) {
    chrome.pageAction.show(tab.id);
});

chrome.pageAction.onClicked.addListener(function(tab) {
    chrome.tabs.getSelected(null, function(tab) {
        chrome.tabs.sendRequest(tab.id, {
            callFunction: "toggleSidebar"
        }, function(response) {
            console.log(response);
        });
    });
});

background.html：

<script type="text/javascript" src="background.js"></script>

的script.js：

function init() {
    chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
        if (request.callFunction == "toggleSidebar") toggleSidebar();
    });

    sidebarOpen = false;
}

function toggleSidebar() {
    var sidebar = document.getElementById('mySidebar');

    if (!sidebar) {
        sidebar = document.createElement('div');
        sidebar.id = "mySidebar";
        sidebar.style.cssText = "position:fixed; top:0px; right:0px; height:100%; background:white;\
        box-shadow:inset 0 0 1em black; z-index:999999;";

        document.body.appendChild(sidebar);
    }

    debugger;
    sidebar.style.width = sidebarOpen ? '0px' : '300px';
    sidebarOpen = !Boolean(sidebarOpen);

    //how to load an angular2 app from here or from background.html
}

init();