Angular 开发5/6版本的浏览器扩展;辅导的指导

Angular 开发5/6版本的浏览器扩展;辅导的指导,angular,browser,Angular,Browser,我想问你一个简单但非常重要的问题。我最近一直在做一个项目,我想开发一个chrome或浏览器扩展。我想在这里使用Angular框架,因为它非常棒,我经常使用它。我想开发Angular中的扩展,只找到了两个关于如何执行此操作的有趣教程。然而,它们大多已经过时。 我知道我至少只需要以下文件: manifest.json index.html(或popup.html) 但是,在后台仍然有类似content-script.js或事件页面的内容。Angular在typescript中,我发现了一个gul

我想问你一个简单但非常重要的问题。我最近一直在做一个项目,我想开发一个chrome或浏览器扩展。我想在这里使用Angular框架,因为它非常棒,我经常使用它。我想开发Angular中的扩展,只找到了两个关于如何执行此操作的有趣教程。然而,它们大多已经过时。 我知道我至少只需要以下文件:

  • manifest.json
  • index.html(或popup.html)

但是,在后台仍然有类似content-script.js或事件页面的内容。Angular在typescript中,我发现了一个gulp taks,它捆绑并构建了一个内容脚本。无论如何,我想问您是否有任何项目/经验或教程,以及如何使用Angular 5/6和最新的CLI和工具开发浏览器或chrome扩展的帮助?

项目设置后,您必须遵循以下步骤

  • 运行命令“ng build”(允许为项目创建生成以便发布,这将在项目中创建dist文件夹)
  • 在dist文件夹中创建manifest.json文件。(基本格式如下)

有关更多信息,请在此处阅读-


我已经创建了chrome扩展。你要做的是开发一个正常的角度延伸应用程序。然后你可以建造它。之后,将manifest.json添加到dist文件夹。我也会帮助你,看看我的文章中的角铬扩展。
{
 “manifest_version”: 2,
 “name”: “ng2 Extension”,
 “description”: “Todo app as chrome extension using angular4”,
 “version”: “1.0”,
 “browser_action”: {
 “default_icon”: “icon.png”,
 “default_popup”: “index.html”
 },
 “permissions”: [],
 “content_security_policy”: “script-src ‘self’ ‘unsafe-eval’; object-src ‘self’”,
 “web_accessible_resources”: [
 “assets/css/*”,
 “assets/js/*”,
 “assets/fonts/*”
 ]
}