Chromium Code Reviews| OLD | NEW |
|---|---|
| 1 --- | 1 --- |
| 2 layout: default | 2 layout: default |
| 3 title: "Install Shared Packages" | 3 title: "Install Shared Packages" |
| 4 description: "Packages are bundles of source code, tools, and resources that hel p you to organize and share code" | 4 description: "Packages are bundles of source code, tools, and resources that hel p you to organize and share code" |
| 5 has-permalinks: true | 5 has-permalinks: true |
| 6 tutorial: | 6 tutorial: |
| 7 id: packages | 7 id: packages |
| 8 next: web-ui | 8 next: web-ui/ |
| 9 next-title: "Get Started with Web UI" | 9 next-title: "Get Started with Web UI" |
| 10 prev: remove-elements | 10 prev: remove-elements/ |
| 11 prev-title: "Remove DOM Elements" | 11 prev-title: "Remove DOM Elements" |
| 12 --- | 12 --- |
| 13 | 13 |
| 14 {% capture whats_the_point %} | 14 {% capture whats_the_point %} |
| 15 | 15 |
| 16 * Packages are awesome. | 16 * Packages are awesome. |
| 17 * Packages are cool. | 17 * Packages are cool. |
| 18 * Share your code in packages, with all your friends at school. | 18 * Share your code in packages, with all your friends at school. |
| 19 | 19 |
| 20 {% endcapture %} | 20 {% endcapture %} |
| 21 | 21 |
| 22 {% capture sample_links %} | 22 {% capture sample_links %} |
| 23 | 23 |
| 24 <p> | 24 <p> |
| 25 Get the vector_math package and many others from:</p> | 25 Get the vector_math package and many others from:</p> |
| 26 | 26 |
| 27 <ul> | 27 <ul> |
| 28 <li> | 28 <li> |
| 29 <a href="http://pub.dartlang.org/" | 29 <a href="https://pub.dartlang.org/" |
| 30 target="_blank">pub.dartlang.org</a> | 30 target="_blank">pub.dartlang.org</a> |
| 31 </li> | 31 </li> |
| 32 </ul> | 32 </ul> |
| 33 | 33 |
| 34 {% endcapture %} | 34 {% endcapture %} |
| 35 | 35 |
| 36 {% capture content %} | 36 {% capture content %} |
| 37 | 37 |
| 38 <div class="tute-target-title"> | 38 <div class="tute-target-title"> |
| 39 <h1>{{page.title}}</h1> | 39 <h1>{{page.title}}</h1> |
| 40 <h3>Borrow and share code.</h3> | 40 <h3>Borrow and share code.</h3> |
| 41 </div> | 41 </div> |
| 42 | 42 |
| 43 Now that you're able to create and run a Dart application | 43 Now that you're able to create and run a Dart application |
| 44 and have a basic understanding of DOM programming, | 44 and have a basic understanding of DOM programming, |
| 45 you are ready to leverage code written by other programmers. | 45 you are ready to leverage code written by other programmers. |
| 46 Many interesting and useful packages of reusable Dart code | 46 Many interesting and useful packages of reusable Dart code |
| 47 are available at the | 47 are available at the |
| 48 <a href="http://pub.dartlang.org/">pub.dartlang.org</a> | 48 <a href="https://pub.dartlang.org/">pub.dartlang.org</a> |
| 49 repository. | 49 repository. |
| 50 | 50 |
| 51 This target shows you how to use `pub`—a package manager | 51 This target shows you how to use `pub`—a package manager |
| 52 that comes with Dart—to | 52 that comes with Dart—to |
| 53 install one of the packages in the repository, | 53 install one of the packages in the repository, |
| 54 the vector_math package. | 54 the vector_math package. |
| 55 You can follow these same steps to install any package hosted at | 55 You can follow these same steps to install any package hosted at |
| 56 <a href="http://pub.dartlang.org/">pub.dartlang.org</a>; | 56 <a href="https://pub.dartlang.org/">pub.dartlang.org</a>; |
| 57 just change the package name when you get to that step. | 57 just change the package name when you get to that step. |
| 58 This target also describes some of the resources you can expect to find | 58 This target also describes some of the resources you can expect to find |
| 59 in a well-built package. | 59 in a well-built package. |
| 60 | 60 |
| 61 * [About the pubspec.yaml file](#about-pubspec) | 61 * [About the pubspec.yaml file](#about-pubspec) |
| 62 * [Name the package dependencies](#name-dependencies) | 62 * [Name the package dependencies](#name-dependencies) |
| 63 * [Install the package dependencies](#install-dependencies) | 63 * [Install the package dependencies](#install-dependencies) |
| 64 * [What did you get (and not get)?](#about-packages) | 64 * [What did you get (and not get)?](#about-packages) |
| 65 * [Import libraries from a package](#use-package) | 65 * [Import libraries from a package](#use-package) |
| 66 * [Other resources](#other-resources) | 66 * [Other resources](#other-resources) |
| 67 | 67 |
| 68 ##About the pubspec.yaml file {#about-pubspec} | 68 ##About the pubspec.yaml file {#about-pubspec} |
| 69 | 69 |
| 70 To use an external package, | 70 To use an external package, |
| 71 your application must itself be a package. | 71 your application must itself be a package. |
| 72 Any application with a valid pubspec.yaml file in its top-level directory | 72 Any application with a valid pubspec.yaml file in its top-level directory |
| 73 is a package and can therefore use external packages. | 73 is a package and can therefore use external packages. |
| 74 When you create an application using Dart Editor, | 74 When you create an application using Dart Editor, |
| 75 Dart Editor automatically creates a `pubspec.yaml` file. | 75 Dart Editor automatically creates a `pubspec.yaml` file. |
| 76 | 76 |
| 77 Start Dart Editor and create a new application with the name `vector_victor`. | 77 Start Dart Editor and create a new application with the name `vector_victor`. |
| 78 Double click pubspec.yaml to view its contents. | 78 Double click pubspec.yaml to view its contents. |
| 79 | 79 |
| 80  | 80  |
| 81 | 81 |
| 82 The pubspec.yaml file contains the package specification written in YAML | 82 The pubspec.yaml file contains the package specification written in YAML |
| 83 (visit <a href="http://pub.dartlang.org/doc/pubspec.html">Pubspec Format</a> | 83 (visit <a href="https://pub.dartlang.org/doc/pubspec.html">Pubspec Format</a> |
| 84 for in-depth coverage). | 84 for in-depth coverage). |
| 85 Dart Editor provides a user interface for editing the pubspec.yaml file | 85 Dart Editor provides a user interface for editing the pubspec.yaml file |
| 86 so that you don't have to worry about the YAML format. | 86 so that you don't have to worry about the YAML format. |
| 87 Or you can click the **Source** tab at the bottom of the Editor pane | 87 Or you can click the **Source** tab at the bottom of the Editor pane |
| 88 to edit the YAML code directly. | 88 to edit the YAML code directly. |
| 89 Below is the pubspec.yaml file that was | 89 Below is the pubspec.yaml file that was |
| 90 created for the vector_victor application. | 90 created for the vector_victor application. |
| 91 | 91 |
| 92  | 92  |
| 93 | 93 |
| (...skipping 49 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 143 Dart Editor adds the package name to the list. | 143 Dart Editor adds the package name to the list. |
| 144 | 144 |
| 145  | 145  |
| 146 | 146 |
| 147 Notice the **Version** field. | 147 Notice the **Version** field. |
| 148 `any` means that this application can use | 148 `any` means that this application can use |
| 149 any version of the vector_math package. | 149 any version of the vector_math package. |
| 150 You could instead specify a particular version of the package. | 150 You could instead specify a particular version of the package. |
| 151 When versioning becomes important to your project, | 151 When versioning becomes important to your project, |
| 152 check out | 152 check out |
| 153 <a href="http://pub.dartlang.org/doc/versioning.html"> | 153 <a href="https://pub.dartlang.org/doc/versioning.html"> |
| 154 Pub's Versioning Philosophy | 154 Pub's Versioning Philosophy |
| 155 </a>. | 155 </a>. |
| 156 | 156 |
| 157 Here's the new pubspec.yaml file: | 157 Here's the new pubspec.yaml file: |
| 158 | 158 |
| 159  | 159  |
| 160 | 160 |
| 161 <a href="http://pub.dartlang.org/">pub.dartlang.org</a> | 161 <a href="https://pub.dartlang.org/">pub.dartlang.org</a> |
| 162 is the primary public repository for Dart packages. | 162 is the primary public repository for Dart packages. |
| 163 `pub` automatically checks that | 163 `pub` automatically checks that |
| 164 website when resolving package dependencies. | 164 website when resolving package dependencies. |
| 165 To use one of the packages from that site, | 165 To use one of the packages from that site, |
| 166 you can specify it by its simple name, | 166 you can specify it by its simple name, |
| 167 as we have done here. | 167 as we have done here. |
| 168 | 168 |
| 169 ##Install the package dependencies {#install-dependencies} | 169 ##Install the package dependencies {#install-dependencies} |
| 170 | 170 |
| 171 In Dart Editor, save pubspec.yaml with **File > Save**. | 171 In Dart Editor, save pubspec.yaml with **File > Save**. |
| 172 When you save the file, | 172 When you save the file, |
| 173 Dart Editor automatically runs | 173 Dart Editor automatically runs |
| 174 <a href="http://pub.dartlang.org/doc/pub-install.html">pub install</a>, | 174 <a href="https://pub.dartlang.org/doc/pub-install.html">pub install</a>, |
| 175 which recursively installs the Dart libraries | 175 which recursively installs the Dart libraries |
| 176 from the packages in the dependencies list. | 176 from the packages in the dependencies list. |
| 177 You can also select **Pub Install** from the **Tools** menu in Dart Editor. | 177 You can also select **Pub Install** from the **Tools** menu in Dart Editor. |
| 178 | 178 |
| 179 Pub puts the libraries in a directory called packages | 179 Pub puts the libraries in a directory called packages |
| 180 under the application's top-level directory. | 180 under the application's top-level directory. |
| 181 Click the wee arrow to expand the packages directory. | 181 Click the wee arrow to expand the packages directory. |
| 182 There you will find the vector_math directory, | 182 There you will find the vector_math directory, |
| 183 which links to the Dart libraries from the vector_math package. | 183 which links to the Dart libraries from the vector_math package. |
| 184 | 184 |
| (...skipping 14 matching lines...) Expand all Loading... | |
| 199 the vector_math package has other resources that might be useful to you | 199 the vector_math package has other resources that might be useful to you |
| 200 that do not get installed into your application directory. | 200 that do not get installed into your application directory. |
| 201 Let's take a step back for a moment to look at what | 201 Let's take a step back for a moment to look at what |
| 202 you got and where it came from. | 202 you got and where it came from. |
| 203 | 203 |
| 204 To see the contents of the vector_math package, | 204 To see the contents of the vector_math package, |
| 205 visit the | 205 visit the |
| 206 <a href="https://github.com/johnmccutchan/vector_math" target="_blank"> | 206 <a href="https://github.com/johnmccutchan/vector_math" target="_blank"> |
| 207 Dart vector math repository | 207 Dart vector math repository |
| 208 </a> | 208 </a> |
| 209 at GitHub. | 209 at github. |
|
Kathy Walrath
2013/07/26 19:33:27
Why this change? I think it's GitHub, located at g
mem
2013/07/26 20:36:32
cuz I use github in a thousand other places! ;-)
| |
| 210 Although many files and directories are in the repository, | 210 Although many files and directories are in the repository, |
| 211 only one, `lib`, was installed when you ran pub install. | 211 only one, `lib`, was installed when you ran pub install. |
| 212 | 212 |
| 213 <div> | 213 <div> |
| 214 <hr> | 214 <hr> |
| 215 <div class="row"> | 215 <div class="row"> |
| 216 <div class="span2"> | 216 <div class="span2"> |
| 217 <img src="images/libraries-folder.png" | 217 <img src="images/libraries-folder.png" |
| 218 alt="Dart libraries directory"/> | 218 alt="Dart libraries directory"/> |
| 219 </div> | 219 </div> |
| (...skipping 26 matching lines...) Expand all Loading... | |
| 246 <img src="images/other-folders.png" | 246 <img src="images/other-folders.png" |
| 247 alt="Document, scripts, tests, and other resources"/> | 247 alt="Document, scripts, tests, and other resources"/> |
| 248 </div> | 248 </div> |
| 249 <div class="span7"> | 249 <div class="span7"> |
| 250 <em>Other resources</em>: | 250 <em>Other resources</em>: |
| 251 Along with Dart libraries, | 251 Along with Dart libraries, |
| 252 a package might also contain other resources | 252 a package might also contain other resources |
| 253 such as example code, tests, scripts, and documentation. | 253 such as example code, tests, scripts, and documentation. |
| 254 If a package contains these resources, | 254 If a package contains these resources, |
| 255 they should be in the directories as specified in the pub | 255 they should be in the directories as specified in the pub |
| 256 <a href="http://pub.dartlang.org/doc/package-layout.html">conventions</a>. | 256 <a href="https://pub.dartlang.org/doc/package-layout.html">conventions</a>. |
| 257 </div> | 257 </div> |
| 258 </div> | 258 </div> |
| 259 <hr> | 259 <hr> |
| 260 </div> | 260 </div> |
| 261 | 261 |
| 262 ##Import libraries from a package {#use-package} | 262 ##Import libraries from a package {#use-package} |
| 263 | 263 |
| 264 Open the vector_math directory by clicking the little arrow. | 264 Open the vector_math directory by clicking the little arrow. |
| 265 | 265 |
| 266  | 266  |
| (...skipping 13 matching lines...) Expand all Loading... | |
| 280 import 'package:vector_math/vector_math.dart'; | 280 import 'package:vector_math/vector_math.dart'; |
| 281 {% endprettify %} | 281 {% endprettify %} |
| 282 | 282 |
| 283 Note that you specify the filename, not the library name. | 283 Note that you specify the filename, not the library name. |
| 284 | 284 |
| 285 ##Other resources | 285 ##Other resources |
| 286 | 286 |
| 287 <ul> | 287 <ul> |
| 288 <li> | 288 <li> |
| 289 Dart developers share packages at | 289 Dart developers share packages at |
| 290 <a href="http://pub.dartlang.org/">pub.dartlang.org</a>. | 290 <a href="https://pub.dartlang.org/">pub.dartlang.org</a>. |
| 291 Look there for packages that might be useful to you, | 291 Look there for packages that might be useful to you, |
| 292 or share your own Dart packages. | 292 or share your own Dart packages. |
| 293 See the <a href="http://pub.dartlang.org/doc/">pub documentation</a> | 293 See the <a href="https://pub.dartlang.org/doc/">pub documentation</a> |
| 294 to get started using and sharing packages. | 294 to get started using and sharing packages. |
| 295 </li> | 295 </li> |
| 296 <li> | 296 <li> |
| 297 One important package that you will find there | 297 One important package that you will find there |
| 298 is | 298 is |
| 299 <a href="http://pub.dartlang.org/packages/web_ui">web_ui</a>—a package | 299 <a href="https://pub.dartlang.org/packages/web_ui">web_ui</a>—a packag e |
| 300 created by the Dart team that lets you use Web components and templating. | 300 created by the Dart team that lets you use Web components and templating. |
| 301 The | 301 The |
| 302 <a href="/docs/tutorials/web-ui/">next target</a> covers Web UI. | 302 <a href="/docs/tutorials/web-ui/">next target</a> covers Web UI. |
| 303 </li> | 303 </li> |
| 304 </ul> | 304 </ul> |
| 305 | 305 |
| 306 {% endcapture %} | 306 {% endcapture %} |
| 307 | 307 |
| 308 {% include tutorial.html %} | 308 {% include tutorial.html %} |
| OLD | NEW |