如何制作chrome扩展程序
简单实现了一个 chrome 的扩展,方法如下:
首先新建一个文件夹,用编辑器写一个文件名为 manifest.json 的文件:
"name": "抓猫!",
"version": "1.0",
"description": "你能抓住她吗?",
"browser_action": {
"default_icon": "icons/icon_19.png",
"popup": "files/game.html"
},
"icons": {
"16": "icons/icon_16.png",
"19": "icons/icon_19.png",
"32": "icons/icon_32.png",
"48": "icons/icon_48.png",
"128": "icons/icon_128.png"
}
}
这其中,如果需要多语言支持的话,可以添加default_locale,并将name&description字段修改为:
"name": "__MSG_name__",
"description": "__MSG_description__",
"default_locale": "zh_CN"
}
并在插件目录下添加 _locales 目录,内置语言文件,如图所示:

这其中 messages.json 内容如下:
"name": {"message": "Catch Cat!"},
"description": {"message": "Can you catch it ?"}
}
插件主程序完成后,直接编写插件所调用的html就可以了 “popup”: “files/game.html”
调试时,可以勾选chrome浏览器扩展程序里面的“开发人员模式”,载入正在开发的扩展程序即可。

开发完成后,使用浏览器打包扩展程序,就可以发给朋友们玩了。欢迎下载体验:
http://uicss.cn/test/cache-cat.crx
建议继续学习:
- Chrome和goagent的配置方法,你懂的 (阅读:16277)
- 警惕 Chrome 的查看源代码 (View Page Source) 功能 (阅读:6685)
- webapp网页调试工具Chrome Devtools (阅读:6321)
- [译]Google Chrome中的高性能网络 (阅读:6067)
- 通过使用Chrome的开发者工具来学习JavaScript (阅读:5518)
- chrome扩展应用开发教程之开发chrome应用基础 (阅读:5338)
- 如何创建google浏览器插件 (阅读:4608)
- Chrome开发者工具的小技巧 (阅读:4626)
- chrome扩展应用开发教程之调试和打包上线 (阅读:4191)
- 15个网站设计和开发的Chrome插件 (阅读:3986)
扫一扫订阅我的微信号:IT技术博客大学习
- 作者:崔凯 来源: 崔凯博客
- 标签: chrome 扩展程序
- 发布时间:2012-04-26 23:36:39
-
[882] WordPress插件开发 -- 在插件使用 -
[136] 解决 nginx 反向代理网页首尾出现神秘字 -
[57] 整理了一份招PHP高级工程师的面试题 -
[55] 分享一个JQUERY颜色选择插件 -
[54] Innodb分表太多或者表分区太多,会导致内 -
[54] 用 Jquery 模拟 select -
[54] 如何保证一个程序在单台服务器上只有唯一实例( -
[52] jQuery性能优化指南 -
[52] CloudSMS:免费匿名的云短信 -
[52] 海量小文件存储
