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 |