首先先大致看一下插件的目录: 以上文件,除了manifest.json为必需文件之外,其他均自行调整。本例子为洛雪音乐助手初期文件,当作模板介绍。 首先查看关键文件manifest.json: index.js文件为进入网易云音乐网页以及子网页后调用的JavaScript代码文件: 点击插件图标后会显示music.html文件界面: 之后给上我的music.png图标,就完成了初步的谷歌插件配置。 在刚才导入按钮旁边有一个打包扩展程序: 以下链接为发布的步骤:
每个使用谷歌浏览器的人都会留一些称心如意的插件,那你们知道怎么做插件吗?
话不多说,开始教程
{ "manifest_version": 2, # manifest版本号 "name": "洛雪音乐助手", # 插件署名 "version": "0.0.1", # 插件版本号 "description": "洛雪音乐助手:随时随地一键下载音乐", # 插件介绍 "author": "Lux", # 作者署名 "content_scripts": [ { # 选择url场景调用,<all_urls>为全部url网址。 "matches": [ "https://music.163.com/*" ], # 以上url中调用本地js模块 "js": [ "index.js" ] } ], "browser_action": { "default_icon": "music.png", # 浏览器右上角插件ico "default_popup": "music.html" # 点击插件后界面显示 }, "icons": { "16": "music.png", # 扩展程序中ico图标,默认16*16 "32": "music.png", # 扩展程序中ico图标,默认32*32 "128": "music.png" # 扩展程序中ico图标,默认128*128 }, "background": { # 扩展启动时自动创建一个包含所有指定脚本的页面 "scripts": [ "background.js" ], # Chrome会将指定的HTML文件作为后台页面运行 "page": [ "" ], # 定义了常驻后台的方式,默认为true "persistent": false } }
alert("别忘了你还有个网易云音乐插件哦~");
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>translation</title> <style> *{ margin:0; padding:0; } span.name { white-space: nowrap; color: lightpink; font-size: 10px; padding: 5px; background: linear-gradient(to right,red,purple); } </style> </head> <body> <span class="name">洛雪音乐助手 v0.0.1</span> <div class="music"> </div> </body> </html>
接下来。我们就可以上传自己做的谷歌插件到谷歌浏览器中查看样式了!
一步制作crx:
点击后放入自己的项目文件夹。
方可打包成功。
文件夹目录下生成{{洛雪音乐助手.pem}}以及{{洛雪音乐助手.crx}}俩文件。
出去方可直接将crx给自己的朋友们即可使用你的扩展程序包了。
发布谷歌插件库中:
https://developer.chrome.com/webstore/publish
(似乎第一次发布需要花费¥5,太贵了我就没正式发布)
(注意是5美金哦~ ~ ~)
最后还是希望你们能给我点一波小小的关注。
奉上自己诚挚的爱心💖
本网页所有视频内容由 imoviebox边看边下-网页视频下载, iurlBox网页地址收藏管理器 下载并得到。
ImovieBox网页视频下载器 下载地址: ImovieBox网页视频下载器-最新版本下载
本文章由: imapbox邮箱云存储,邮箱网盘,ImageBox 图片批量下载器,网页图片批量下载专家,网页图片批量下载器,获取到文章图片,imoviebox网页视频批量下载器,下载视频内容,为您提供.
阅读和此文章类似的: 全球云计算