You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: doc/article/en-US/jspm-bundling.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
---
2
2
{
3
-
"name": "Bundling Your App for Deploy",
3
+
"name": "JSPM Bundling",
4
4
"culture": "en-US",
5
5
"description": "Before deploying your app to production, you'll want to bundle the assets for efficient use of the network.",
6
6
"engines": { "aurelia-doc" : "^1.0.0" },
@@ -33,9 +33,9 @@ To make this process efficient, we need to compress the assets and make fewer (p
33
33
34
34
Bundling along with minification are techniques that can also be used to improve load time. Bundling and minification improve load time by reducing the number of requests to the server as well as reducing the size of requested assets such as views, view-models and CSS.
35
35
36
-
## [Bundling an Aurelia Application](aurelia-doc://section/3/version/1.0.0)
36
+
## [Bundling an Aurelia JSPM Application](aurelia-doc://section/3/version/1.0.0)
37
37
38
-
We can use [Aurelia Bundler](http://github.com/aurelia/bundler) to create a gulp task for bundling our app. Let's jump right into it. We will use the `skeleton-navigation` as our app to bundle. If you don't have that set up. Follow [these steps](https://github.com/aurelia/skeleton-navigation#running-the-app).
38
+
We can use [Aurelia Bundler](http://github.com/aurelia/bundler) to create a gulp task for bundling our JSPM app. Let's jump right into it. We will use the `skeleton-navigation` as our app to bundle. If you don't have that set up. Follow [these steps](https://github.com/aurelia/skeleton-navigation#running-the-app).
39
39
40
40
Now that we have our app running, let's start by installing `aurelia-bundler`. To do so `cd` into `skeleton-navigation` and run the following command:
Copy file name to clipboardExpand all lines: doc/article/en-US/jspm-setup.md
+5-8Lines changed: 5 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,8 +1,8 @@
1
1
---
2
2
{
3
-
"name": "A Production Setup",
3
+
"name": "JSPM Setup",
4
4
"culture": "en-US",
5
-
"description": "If you've completed the Getting Started guide and have had some time to play around with Aurelia, you're probably ready to start building a real application. This guide will help you to get set up with a production-ready starter-kit and show you how to accomplish a few common tasks.",
5
+
"description": "If you're interested in getting setup with JSPM to build projects, this article will take you through setting up both your machine and a production quality starter project.",
6
6
"engines": { "aurelia-doc" : "^1.0.0" },
7
7
"author": {
8
8
"name": "Rob Eisenberg",
@@ -32,9 +32,6 @@ Next, we need to install [jspm](http://jspm.io/). This will serve as our client-
32
32
npm install -g jspm
33
33
```
34
34
35
-
> Info
36
-
> Don't want to use jspm? No problem. All Aurelia packages are available via [Bower](http://bower.io/), GitHub and NPM.
37
-
38
35
## [Setting up the Project Structure and Build](aurelia-doc://section/2/version/1.0.0)
39
36
40
37
With the tooling installed, we can now turn our attention to setting up a basic structure for your app. We'll begin by downloading a skeleton. We've got several versions available for you based on your language and tooling preferences. Please download the latest skeletons now.
@@ -43,20 +40,20 @@ With the tooling installed, we can now turn our attention to setting up a basic
43
40
<aclass="au-button"href="https://github.com/aurelia/skeleton-navigation/releases/latest"style="text-decoration: none; margin: 32px8px42px8px;"target="_blank">Download the Skeletons</a>
44
41
</div>
45
42
46
-
Once the download has completed, unzip it and look inside. The readme file contained therein will explain the various options available to you. Please select one of the skeletons and copy it to the location on your file system that you wish your code to reside. Be sure to rename the folder to appropriately represent the app you want to build. Based on your selection, you'll want to configure this documentation to show the appropriate programming language for all samples. Look at the top of this page. You will see a language selector. Be sure to select the language that matches the package that you downloaded.
43
+
Once the download has completed, unzip it and look inside. The readme file contained therein will explain the various options available to you. Please select one of the skeletons and copy it to the location on your file system that you wish your code to reside. Be sure to rename the folder to appropriately represent the app you want to build.
47
44
48
45
You will now find everything you need inside the folder, including a basic build, package configuration, styles and more. With all this in place, let's run some commands.
49
46
50
47
1. Open a console and change directory into your app's directory.
51
-
2. Execute the following command to install the Gulp plugins listed in the _devDependencies_ section of the package manifest:
48
+
2. Execute the following command to install the dependencies listed in the _devDependencies_ section of the package manifest:
52
49
```shell
53
50
npm install
54
51
```
55
52
3. Next, execute the following command to install the Aurelia libraries, bootstrap and font-awesome, listed in the _jspm.dependencies_ section of the package manifest:
56
53
```shell
57
54
jspm install -y
58
55
```
59
-
Everything we've done so far is standard Node.js build and package management procedures. It doesn't have anything specific to do with Aurelia itself. We're just walking you through setting up a modern ${context.language.name} project and build configuration from scratch. You may be familiar with this already, but if not then welcome to this new and exciting world!
56
+
Everything we've done so far is standard Node.js build and package management procedures. It doesn't have anything specific to do with Aurelia itself. We're just walking you through setting up a modern ${context.language.name} project and build configuration from scratch.
60
57
61
58
> Info
62
59
> Bootstrap and Font-Awesome are **not** dependencies of Aurelia. We only leverage them as part of the starter kit in order to help you quickly achieve a decent look out-of-the-box. You can easily replace them with whatever your favorite CSS framework and/or icon library is.
0 commit comments