| OLD | NEW |
| (Empty) | |
| 1 <h1 class="page_title">Packaging</h1> |
| 2 <div id="pageData-showTOC" class="pageData">true</div> |
| 3 <p> |
| 4 This page describes how to package your extension. |
| 5 As the <a href="overview.html">Overview</a> explains, |
| 6 extensions are packaged as signed ZIP files |
| 7 with the file extension "crx"—for example, |
| 8 <code>myextension.crx</code>. |
| 9 </p> |
| 10 <p> |
| 11 <b>Note:</b> |
| 12 You might not need to package your extension. |
| 13 If you publish your extension using the |
| 14 <a href="https://chrome.google.com/webstore/developer/dashboard">Chrome Develope
r Dashboard</a>, |
| 15 then the only reason to create your own <code>.crx</code> file |
| 16 would be to distribute a non-public version—for example, |
| 17 to alpha testers. |
| 18 You can find information on publishing extensions and apps in the |
| 19 Chrome Web Store getting started tutorial, starting at |
| 20 <a href="http://code.google.com/chrome/webstore/docs/get_started_simple.html#ste
p5">Step 5: Zip up your app</a>. |
| 21 </p> |
| 22 <p> |
| 23 When you package an extension, |
| 24 the extension is assigned a unique key pair. |
| 25 The extension's ID is based on a hash of the public key. |
| 26 The private key is kept private |
| 27 and used to sign each version of the extension. |
| 28 </p> |
| 29 <h2>Creating a package</h2> |
| 30 <p>To package an extension:</p> |
| 31 <ol> |
| 32 <li> |
| 33 Bring up the Extensions management page |
| 34 by going to this URL: |
| 35 <blockquote> |
| 36 <b>chrome://extensions</b> |
| 37 </blockquote> |
| 38 </li> |
| 39 <li> |
| 40 If <b>Developer mode</b> has a + by it, |
| 41 click the +. |
| 42 </li> |
| 43 <li> |
| 44 Click the <b>Pack extension</b> button. |
| 45 A dialog appears. |
| 46 </li> |
| 47 <li> |
| 48 In the <b>Extension root directory</b> field, |
| 49 specify the path to the extension's folder—for example, |
| 50 <code>c:\myext</code>. |
| 51 (Ignore the other field; |
| 52 you don't specify a private key file |
| 53 the first time you package a particular extension.) |
| 54 </li> |
| 55 <li> |
| 56 Click <b>OK</b>. |
| 57 The packager creates two files: |
| 58 a <code>.crx</code> file, |
| 59 which is the actual extension that can be installed, |
| 60 and a <code>.pem</code> file, |
| 61 which contains the private key. |
| 62 </li> |
| 63 </ol> |
| 64 <p> |
| 65 <b>Do not lose the private key!</b> |
| 66 Keep the <code>.pem</code> file secret and in a safe place. |
| 67 You'll need it later if you want to do any of the following: |
| 68 </p> |
| 69 <ul> |
| 70 <li><a href="#update">Update</a> the extension</li> |
| 71 <li><a href="#upload">Upload</a> the extension to the Chrome Web Store</li> |
| 72 </ul> |
| 73 <p> |
| 74 If the extension is successfully packaged, you'll see a dialog like this |
| 75 that tells you where to find |
| 76 the <code>.crx</code> and <code>.pem</code> files:</p> |
| 77 </p> |
| 78 <img src="{{static}}/images/package-success.gif" |
| 79 width="554" height="208" /> |
| 80 <h2 id="update">Updating a package</h2> |
| 81 <p>To create an updated version of your extension:</p> |
| 82 <ol> |
| 83 <li> |
| 84 Increase the version number in <code>manifest.json</code>. |
| 85 </li> |
| 86 <li> |
| 87 Bring up the Extensions management page |
| 88 by going to this URL: <b>chrome://extensions</b> |
| 89 </li> |
| 90 <li> |
| 91 Click the <b>Pack extension</b> button. |
| 92 A dialog appears. |
| 93 </li> |
| 94 <li> |
| 95 In the <b>Extension root directory</b> field, |
| 96 specify the path to the extension's folder—for example, |
| 97 <code>c:\myext</code>. |
| 98 </li> |
| 99 <li> |
| 100 In the <b>Private key file</b> field, |
| 101 specify the location of the |
| 102 already generated <code>.pem</code> file for this extension—for |
| 103 example, <code>c:\myext.pem</code>. |
| 104 </li> |
| 105 <li> |
| 106 Click <b>OK</b>. |
| 107 </li> |
| 108 </ol> |
| 109 <p>If the updated extension is successfully packaged, you'll see a dialog like t
his:</p> |
| 110 <img src="{{static}}/images/update-success.gif" |
| 111 width="298" height="160" /> |
| 112 <h2 id="upload"> Uploading a previously packaged extension to the Chrome Web Sto
re</h2> |
| 113 <p> |
| 114 You can use the Chrome Developer Dashboard |
| 115 to upload an extension that you've previously packaged yourself. |
| 116 However, unless you take special steps, |
| 117 the extension's ID in the Chrome Web Store |
| 118 will be different from its ID in the package you created. |
| 119 This different ID might be a problem if you've |
| 120 distributed your extension package, |
| 121 because it allows users to install multiple versions of your extension, |
| 122 each with its own local data. |
| 123 </p> |
| 124 <p> |
| 125 If you want to keep the extension ID the same, |
| 126 follow these steps: |
| 127 </p> |
| 128 <ol> |
| 129 <li> Rename the private key that was generated |
| 130 when you created the <code>.crx</code> file to <code>key.pem</code>. </li> |
| 131 <li> Put <code>key.pem</code> in the top directory |
| 132 of your extension. </li> |
| 133 <li> Compress that directory into a ZIP file. </li> |
| 134 <li> Upload the ZIP file using the |
| 135 <a href="https://chrome.google.com/webstore/developer/dashboard">Chrome Deve
loper Dashboard</a>. </li> |
| 136 </ol> |
| 137 <h2>Packaging at the command line</h2> |
| 138 <p> |
| 139 Another way to package extensions |
| 140 is by invoking <code>chrome.exe</code> at the command line. |
| 141 Use the <code>--pack-extension</code> flag |
| 142 to specify the location of the extension's folder. |
| 143 Use <code>--pack-extension-key</code> |
| 144 to specify the location of the extension's private key file. |
| 145 For example: |
| 146 </p> |
| 147 <pre> |
| 148 chrome.exe --pack-extension=c:\myext --pack-extension-key=c:\myext.pem |
| 149 </pre> |
| 150 <p> |
| 151 To suppress the dialog, |
| 152 add <code>--no-message-box</code> to the command. |
| 153 </p> |
| 154 <h2>Package format and scripts</h2> |
| 155 <p> |
| 156 For more information on the format, as well as pointers to scripts you can use |
| 157 to create <code>.crx</code> files, see <a href="crx.html">CRX Package Format</a>
. |
| 158 </p> |
| OLD | NEW |