本教程旨在指导你完成第一个打包应用(packaged app)。Packaged app的结构与扩展(extension)类似，开发人员会发现类似的清单与打包方法。完成开发后，只需zip代码及相关文件就可以发布app了。
一个packaged app包括如下组件：
- 清单。App的介绍，如何运行及必需的额外权限。
- 背景脚本。用于创建活动页面，负责管理App的生存周期。
- 代码。包括相关的HTML，JS，CSS及本地客户端模块。
- 图标及其它素材。
第一步：创建清单
创建文件manifest.json：
{
"name": "Hello World!",
"description": "My first packaged app.",
"version": "0.1",
"app": {
"background": {
"scripts": ["background.js"]
}
},
"icons": { "16": "calculator-16.png","128": "calculator-128.png" }
}第二步：创建背景脚本
创建一个新文件backgroud.js,内容如下
chrome.app.runtime.onLaunched.addListener(function(){
chrome.app.window.create('window.html', {
'bounds': {
'width': 400,
'height': 500
}
});
});在上面示例代码中，onLaunched事件会在用户启动App时会被最先触发。它会打开一个指定了高度与宽度的窗口。在背景脚本中可以包含其它监听器、窗口、后处理消息及启动数据，所有这些都将用于管理App的活动页面。
第三步：创建一个窗口页
创建你的window.html,内容如下：
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div>Hello, world!</div>
</body>
</html>第四步：创建图标文件
拷贝图标文件到你的App目录下：
- calculator-16.png
- calculator-128.png
第五步：运行App
启动标记
很多packaged app仍然处理实验阶段，因此你应当启动实验标记，从而可以对它们进行尝试
转到chrome://flags
找到"ExperimentalExtension APIs",点击它的"Enable"链接
重启chrome
加载你的App
为了加载你的App,点击设置菜单，选择Tools->Extensions,打开应用与扩展管理面,
选中Developermode的复选框
点击Loadunpacked extension按钮，并选取你的App目录，点击OK即可。
打开一个新的Tab并运行
一旦加载App成功报，打开一个新的Tab并点击你的App图标。
扫一扫
1530
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
