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
{{ message }}
This repository was archived by the owner on Apr 8, 2020. It is now read-only.
Copy file name to clipboardExpand all lines: README.md
+22-26Lines changed: 22 additions & 26 deletions
Original file line number
Diff line number
Diff line change
@@ -24,29 +24,37 @@ This repo contains:
24
24
* Server-side and client-side routing integration ([docs](https://github.com/aspnet/JavaScriptServices/tree/dev/src/Microsoft.AspNetCore.SpaServices#routing-helper-mapspafallbackroute))
25
25
* Server-side and client-side validation integration
26
26
* "Lazy loading" for Knockout apps
27
-
* A Yeoman generator that creates preconfigured app starting points ([guide](http://blog.stevensanderson.com/2016/05/02/angular2-react-knockout-apps-on-aspnet-core/))
28
27
* Samples and docs
29
28
30
-
It's cross-platform (Windows, Linux, or macOS) and works with .NET Core 1.0.1 or later.
29
+
It's cross-platform (Windows, Linux, or macOS) and works with .NET Core 2.0 or later.
31
30
32
31
## Creating new applications
33
32
34
-
If you want to build a brand-new ASP.NET Core app that uses Angular / React / Knockout on the client, consider starting with the `aspnetcore-spa` generator. This lets you choose your client-side framework. It generates a starting point that includes applicable features such as Webpack dev middleware, server-side prerendering, and efficient production builds. It's much easier than configuring everything to work together manually!
33
+
Prerequisites:
35
34
36
-
To do this, install Yeoman and these generator templates:
*[Node.js](https://nodejs.org/) version 6 (or later)
37
37
38
-
npm install -g yo generator-aspnetcore-spa
38
+
With these prerequisites, you can immediately create new ASP.NET Core applications that use Angular, React, or React+Redux without having to install anything extra.
39
39
40
-
Generate your new application starting point:
40
+
### Option 1: Creating Angular/React/Redux applications from the command line (cross-platform)
41
41
42
-
cd some-empty-directory
43
-
yo aspnetcore-spa
42
+
In an empty directory, run (for example) `dotnet new angular`. Other supported SPA frameworks include React and React+Redux. You can see the list of available SPA templates by running `dotnet new spa`.
44
43
45
44
Once the generator has run and restored all the dependencies, you can start up your new ASP.NET Core SPA:
46
45
46
+
npm install
47
47
dotnet run
48
48
49
-
For a more detailed walkthrough, see [getting started with the `aspnetcore-spa` generator](http://blog.stevensanderson.com/2016/05/02/angular2-react-knockout-apps-on-aspnet-core/).
49
+
### Option 2: Creating Angular/React/Redux applications using Visual Studio 2017 Update 3 or later (Windows only)
50
+
51
+
Using the `File`->`New Project` dialog, select *ASP.NET Core Web Application*. You will then be offered the option to create an application with Angular, React, or React+Redux. When the application is created, you can build and run it in the normal way.
52
+
53
+
### More info and other SPA frameworks
54
+
55
+
For a more detailed (albeit somewhat outdated) walkthrough, see [getting started with the `aspnetcore-spa` generator](http://blog.stevensanderson.com/2016/05/02/angular2-react-knockout-apps-on-aspnet-core/).
56
+
57
+
If you want to build an ASP.NET Core application with Aurelia, Knockout, or Vue, you can use the `Microsoft.AspNetCore.SpaTemplates` package. On the command line, run `dotnet new --install Microsoft.AspNetCore.SpaTemplates`. Then you will be able to run `dotnet new aurelia` (or `dotnet new vue`, etc.) to create your new application.
50
58
51
59
## Adding to existing applications
52
60
@@ -58,18 +66,13 @@ If you have an existing ASP.NET Core application, or if you just want to use the
58
66
* Find [documentation and usage examples here](https://github.com/aspnet/JavaScriptServices/tree/dev/src/Microsoft.AspNetCore.NodeServices#microsoftaspnetcorenodeservices).
59
67
*`Microsoft.AspNetCore.SpaServices`
60
68
* This provides infrastructure that's generally useful when building Single Page Applications (SPAs) with technologies such as Angular or React (for example, server-side prerendering and webpack middleware). Internally, it uses the `NodeServices` package to implement its features.
61
-
* Find [documentation and usage examples here](https://github.com/aspnet/JavaScriptServices/tree/dev/src/Microsoft.AspNetCore.SpaServices#microsoftaspnetcorespaservices).
62
-
*`Microsoft.AspNetCore.AngularServices`
63
-
* This builds on the `SpaServices` package and includes features specific to Angular. Currently, this includes validation helpers.
64
-
* The code is [here](https://github.com/aspnet/JavaScriptServices/tree/dev/src/Microsoft.AspNetCore.AngularServices). You'll find a usage example for [the validation helper here](https://github.com/aspnet/JavaScriptServices/blob/dev/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-edit/album-edit.ts).
69
+
* Find [documentation and usage examples here](https://github.com/aspnet/JavaScriptServices/tree/dev/src/Microsoft.AspNetCore.SpaServices#microsoftaspnetcorespaservices)
65
70
66
-
There was previously a `Microsoft.AspNetCore.ReactServices` but this is not currently needed - all applicable functionality is in `Microsoft.AspNetCore.SpaServices`, because it's sufficiently general. We might add a new `Microsoft.AspNetCore.ReactServices` package in the future if new React-specific requirements emerge.
71
+
There were previously other packages called `Microsoft.AspNetCore.AngularServices` and `Microsoft.AspNetCore.ReactServices` but these are not currently needed - all applicable functionality is in `Microsoft.AspNetCore.SpaServices`, because it's sufficiently general.
67
72
68
73
If you want to build a helper library for some other SPA framework, you can do so by taking a dependency on `Microsoft.AspNetCore.SpaServices` and wrapping its functionality in whatever way is most useful for your SPA framework.
69
74
70
-
## Samples and templates
71
-
72
-
Inside this repo, [the `templates` directory](https://github.com/aspnet/JavaScriptServices/tree/dev/templates) contains the application starting points that the `aspnetcore-spa` generator emits. You can clone this repo and run those applications directly. But it's easier to [use the Yeoman tool to run the generator](http://blog.stevensanderson.com/2016/05/02/angular2-react-knockout-apps-on-aspnet-core/).
75
+
## Samples
73
76
74
77
The [`samples` directory](https://github.com/aspnet/JavaScriptServices/tree/dev/samples) contains examples of:
75
78
@@ -88,13 +91,6 @@ The [`samples` directory](https://github.com/aspnet/JavaScriptServices/tree/dev/
88
91
89
92
## Contributing
90
93
91
-
If you're interested in contributing to the various packages, samples, and project templates in this repo, that's great! You can run the code in this repo as follows:
92
-
93
-
* Clone the repo
94
-
* Run `dotnet restore` at the repo root dir
95
-
* Go to whatever sample or template you want to run (for example, `cd templates/AngularSpa`)
96
-
* Restore NPM dependencies (run `npm install`)
97
-
* If the sample/template you're trying to run has a file called `webpack.config.vendor.js` at its root, run `webpack --config webpack.config.vendor.js`. If it has a file called `webpack.config.js`, run `webpack` (no args). You might need to install webpack first, by running `npm install -g webpack`.
98
-
* Launch it (`dotnet run`)
94
+
If you're interested in contributing to the various packages, samples, and project templates in this repo, that's great!
99
95
100
-
If you're planning to submit a pull request, and if it's more than a trivial fix (for example, for a typo), it's usually a good idea first to file an issue describing what you're proposing to do and how it will work. Then you can find out if it's likely that such a pull request will be accepted, and how it fits into wider ongoing plans.
96
+
Before working on a pull request, especially if it's more than a trivial fix (for example, for a typo), it's usually a good idea first to file an issue describing what you're proposing to do and how it will work. Then you can find out if it's likely that such a pull request will be accepted, and how it fits into wider ongoing plans.
0 commit comments