前言
大家好 年轻男女 注意 请求收集 鼓掌
另一个为自己投票:https://bbs.com/I'm sorry, csdn. 你在这里做什么,Net/topics/603955887?Spm=1001.20143.3001.6953, 诚实和值得信赖真是太好了。谢谢。
前一篇文章「Vue3+TS」建立自己的网站, 是因为一些小伙伴留下纸条, 表示他们想建立自己的主页, 互联网上有一些免费的静态服务器可供部署使用。例如,可通过登记账户或核实账户,立即使用Github、gitee等;
然而,有一种直接的、比较容易的办法。为它创建铬插件 。,像CSPN正式提供的铬插件一样,铬浏览器的默认页面直接被修改,这样Chrome默认页面就可以被重塑为我们的起始页,但是,由于没有服务器,许多客户无法分享历史记录和大众信息;
目标
本文的目标是：在本文中,您可以确切地知道铬插件是什么,以及如何通过带有起始页的小项目创建一个铬插件。；
下载
我将上篇文章的首页修改为用于实践的铬插件,不论资源是张贴到持发委,还是如果一个无法及时下载的小伙伴离开了盒子,我会通过电子邮件将代码发送给你;
下载铬插件
(c) 铬下载地址:点击下载,这是一个捆绑的铬插件,可在启用开发者模式时直接使用。
打开 “开发者模式” ，之后点击“加载已解压扩展程序)将挑选完整下载的文件夹,供使用。
源码下载
源下载地址: 点击以获取要插入的页面的源代码 。
效果图
效果图证明了这一点。当我们打开新页面标记时,该页面不是铬的默认页面,而是我们设置的起始页面。铬插件用于生成此外观 。
chrome插件
简介
实际上,我们讨论的是一个Chorme插件。铬添加，真正的铬插件应该是一个更基本的浏览器扩展名 。然而,鉴于将铬扩展作为插件的倾向,因此,我们按照我们的习俗雇用它。然而,小伙伴应该知道 我们所说的发光插件 是铬扩展。
铬插件是用网络技术创建的软件, 用来改进浏览器功能。 它实际上是由 HTML、 CSS、 JavaScript、 图像等组成的资源 。.crx后缀的压缩包；
换句话说,我们的前端完全有能力创建一个铬插件,由HTML、CSS和JavaScript组成,所有这些是访问者的工具。
manifest.json
这是 Chrame 插件的主配置文件。 此文件正在由 Chrame 浏览器阅读, 以确定您打算用此插件完成什么 。 以下是我们起始页的 mod. json 文件 。
- 插件的名称是我们的起始页插件的名称,是起始页的名称。
- 插件版本,我们的插件版本,是2. 5。
- (b) 示意版本:版本、铬文件版本,价值为2;
- (a) 描述:插件描述;
- (a) 拍卖委托人;
- 图标 : 当我在铬浏览器中安装插件时, 我们注意到工具栏中有一个小图标, 与这里的照片匹配 ;
- 铬_ url_ overrides: 覆盖浏览器的默认页面, 是此插件的主要设置, 是我们用来在浏览器上覆盖首页的页面 。
到这里，很简单吧?最后,我们把包装文件放在文件夹中。然后有一份新的名单 Json档案然后,铬_url_overrides项目的配置数据被定义为起始页的目录。这样就完成了，并且,排除事实 我们保持它简单,然而,这个配置文件有许多剖面图。大致如下，以下是一百世纪一位巨人发来的讯息。感觉非常全了：
content-scripts
在配置文件中,还有一个非常关键的配置项目:联系人的脚本等。那么这个安排呢?就问一个问题吧，你熟悉购物网站吗?我们一到,就开始买东西但一旦我们开始抢劫, 它通常就消失了。为什么？某些人使用脚本。你是怎么拿到剧本的?实际上,目前的网页已经通过联系编号输入了js代码。多姆可以通过js代码进入。(b) 以下步骤等;
通过在目前页面中添加脚本来理解这一特性,可以使用广告屏蔽和CSS修改网页等标准能力。
例如,当我们把jquery注入到当前页面和我们作为皮肤创建的 CSS 风格文件之后,会怎样呢?
popup
此属性描述当单击扩展栏中的小图标时出现的菜单。请考虑以下内容:
这是铬插件本身。相信大家很熟悉，当我们点击这个符号时,我们得到插件将弹出一个下拉菜单 。此菜单实际上是 HTML 文件 。在文档中,您可以写任何您想要的东西。可能有个操作按钮什么的这个怎么实现？它实际上是通过使用弹出来完成的。
弹出页面可以通过默认的 _ 流行参数配置, 也可以通过执行设置流行 () 配置 :
值得指出的是,弹出页面的生命周期非常短,从我们点击图标打开页面开始,到我们不注意关闭 html 页面时结束,因此长期运行的程序不包含在这个 html 文件里。
background
因为弹出弹出后的生命周期如此短,是否有财产可以在铬的后台长期运行?
设置后，可通过以下网址查阅:chrome-extension://xx/background.com.html,该网址打开了我们设置的后台网页。当然，因为为此特性选择的页面将从开始到结束运行, 它将从后台开始运行 。因此非常消耗性能，它只应作为最后手段使用。毕竟,它变成了一个不直接回应的浏览器。
event-pages
此外,与背景相反,后空会相当可支配, 因为后空会持续到后台运行的时间长度 。因此,谷歌创建了事件页属性。仿佛只有需要的时候才装上子弹例如,插件首次更新,向插件发送了联系人手稿信息,等等。空闲了就会被关闭：
一些小问题
当您包装预先公布的 Vue 代码时, 您能否将其放入插件, 但仍无法访问页面?
比如在之前那篇
Vue3+TS 创建主页 。
条款中的代码,如果直接打包，当你把它放到插件里, 你会看到网站没有打开。为什么呢？
在现实中, 铬插件的 html 代码必须被本地访问 。这类似于本地双击并打开 html 文件 。这不是服务器模式的操作方式 。
因此, 如果您想要在插件中放置页面, 代码必须本地打开 。 例如, 在前面的代码中, 我们使用的是 root- view, 但是当本地双击打开运行时无法装入 root- view, 所以它必须被更改 。
我直接取消了根视图,取而代之的是引入组件,以便加以利用。 我将 html 文件中的资源路径修改为相对路径, 从而可以找到 html 中引入的静态文档, 例如 :
本节中所有静态资源文件的路径必须是相对的,而不是绝对的;
小结
这是对铬插件的开发以及Chrome 插件中极其重要的配置文件的快速总结: manyest. com。 json 文件以及一些最关键配置的简要描述, 这些配置文件是Chrome 插件开发的文档讨论摘要, 以及Chrome 插件中非常重要的配置文件: manyest. com。 json 文件以及配置文件中一些更关键配置的简要描述 。
如果你和合伙人有分歧 你可以留下纸条或手写信件