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