commit for merge
commit
71137963c8
@ -2,6 +2,6 @@
|
|||||||
"ExpandedNodes": [
|
"ExpandedNodes": [
|
||||||
""
|
""
|
||||||
],
|
],
|
||||||
"SelectedNode": "\\07.-Setting-up-the-Xamarin-mobile-apps.md",
|
"SelectedNode": "\\Home.md",
|
||||||
"PreviewInSolutionExplorer": false
|
"PreviewInSolutionExplorer": false
|
||||||
}
|
}
|
Binary file not shown.
BIN
.vs/slnx.sqlite
BIN
.vs/slnx.sqlite
Binary file not shown.
@ -97,6 +97,14 @@ Below you can see the full **eShopOnContainers-ServicesAndWebApps.sln** solution
|
|||||||
|
|
||||||
Note how VS 2017 loads the docker-compose.yml files in a special node-tree so it uses that configuration to deploy/debug all the containers configured, at the same time into your Docker host.
|
Note how VS 2017 loads the docker-compose.yml files in a special node-tree so it uses that configuration to deploy/debug all the containers configured, at the same time into your Docker host.
|
||||||
|
|
||||||
|
#### Build the Web SPA application with NPM
|
||||||
|
If you want to run/test the web eShopOnContainers SPA (Single Page Application) client in adition to the regular MVC Web app, you need to install certain dependencies for the client side and build it with "npm build", as the client side of the SPA app is based on ANGULAR 2, TypeScript and other JS frameworks and compilation that needs to happen before building the Docker images.
|
||||||
|
The process is described in detail here:
|
||||||
|
https://github.com/dotnet/eShopOnContainers/wiki/06.-Setting-the-Web-SPA-application-up
|
||||||
|
|
||||||
|
Come back to this point when you finished with the "Setting the SPA up" process.
|
||||||
|
|
||||||
|
|
||||||
#### Build and run eShopOnContainers from Visual Studio 2017
|
#### Build and run eShopOnContainers from Visual Studio 2017
|
||||||
|
|
||||||
##### Set docker-compose as the default StartUp project
|
##### Set docker-compose as the default StartUp project
|
||||||
|
@ -114,7 +114,7 @@ These steps are easily performed by running a convenient script already created
|
|||||||
<img src="img/cli-windows/build-bits-3-catalog-bits.png">
|
<img src="img/cli-windows/build-bits-3-catalog-bits.png">
|
||||||
|
|
||||||
|
|
||||||
### Buil Images and Deploy containers into your Docker host
|
### Build Images and Deploy containers into your Docker host
|
||||||
You can build the Docker images and deploy the containers to a regularDocker host by using the Docker CLI tool `docker-compose up` which is very convenient for multi-container applications as it can build all the Docker images for you and then spin-up all the multiple containers of your application, all with a single command.
|
You can build the Docker images and deploy the containers to a regularDocker host by using the Docker CLI tool `docker-compose up` which is very convenient for multi-container applications as it can build all the Docker images for you and then spin-up all the multiple containers of your application, all with a single command.
|
||||||
If you don't want to deploy the containers but only build the images, you can do so by running `docker-compose build`
|
If you don't want to deploy the containers but only build the images, you can do so by running `docker-compose build`
|
||||||
These are the steps:
|
These are the steps:
|
||||||
|
@ -30,8 +30,8 @@ http://www.hanselman.com/blog/VisualStudio2015FixingDependenciesNpmNotInstalledF
|
|||||||
Now, you need to build the SPA app (TypeScript and Angular 2 based client app) with NPM.
|
Now, you need to build the SPA app (TypeScript and Angular 2 based client app) with NPM.
|
||||||
* Open a command-prompt window and move to the root of the SPA application (src\Web\WebSPA\eShopOnContainers.WebSPA)
|
* Open a command-prompt window and move to the root of the SPA application (src\Web\WebSPA\eShopOnContainers.WebSPA)
|
||||||
* Run the command <b>npm install</b> as shown below:
|
* Run the command <b>npm install</b> as shown below:
|
||||||
|
<img src="img/spa/npm-install.png">
|
||||||
* Then, run the command <b>npm run build:prod</b> as shown below:
|
* Then, run the command <b>npm run build:prod</b> as shown below:
|
||||||
<p>
|
|
||||||
<img src="img/spa/npm-run-build-prod.png">
|
<img src="img/spa/npm-run-build-prod.png">
|
||||||
|
|
||||||
If you get an error like <b>"Node Sass could not find a binding for your current environment: Windows 64-bit with Node.js 6.x"</b>, then run the command <b>npm rebuild node-sass</b> as in the following screenshot:
|
If you get an error like <b>"Node Sass could not find a binding for your current environment: Windows 64-bit with Node.js 6.x"</b>, then run the command <b>npm rebuild node-sass</b> as in the following screenshot:
|
||||||
@ -40,6 +40,17 @@ Then, run again the <b>npm run build:prod</b> command that should finish with no
|
|||||||
|
|
||||||
<img src="img/spa/npm-run-build-prod-no-errors.png">
|
<img src="img/spa/npm-run-build-prod-no-errors.png">
|
||||||
|
|
||||||
|
#### (Optional) Run NPM tasks from within Visual Studio 2017
|
||||||
|
|
||||||
|
As the chosen workload method when developing a client frontend app (JS frameworks, etc.), the developer has to be able to trigger the npm tasks when he wants.
|
||||||
|
Of course, he can always open a command propmt and run npm from the CLI as you just did in the steps above (which is most front-end devs do, in fact).
|
||||||
|
However, you can also run npm tasks inside Visual Studio if you install the following VS extension: https://marketplace.visualstudio.com/items?itemName=MadsKristensen.NPMTaskRunner
|
||||||
|
|
||||||
|
This extension adds to the "Task Runner Explorer" the capabailities to run npm tasks (since, out of the box, only gulp/grunt tasks are supported by VS2017). After this extension is installed you can run npm tasks from inside VS2017 and also set build bindings if you wanted.
|
||||||
|
|
||||||
|
<img src="img/spa/task-runner-with-npm-extension.png">
|
||||||
|
|
||||||
|
This extension honors the VS External Web Tools configuration, and allows you to use bindings, so if you want to run npm tasks automatically on every VS build, you could do so. This is not set as default in the eShopOnContainers provided code as it would slow down each VS build with the npm build tasks.
|
||||||
|
|
||||||
### Build the Docker images and Deploy the containers
|
### Build the Docker images and Deploy the containers
|
||||||
At this point, if you were originally following the eShopOnContainer setup for any environment and came to this page just to setup the SPA app, now go back to your original setup instructions page. Other than that, you can in any case choose between any of the following options to build and deploy the Docker containers:
|
At this point, if you were originally following the eShopOnContainer setup for any environment and came to this page just to setup the SPA app, now go back to your original setup instructions page. Other than that, you can in any case choose between any of the following options to build and deploy the Docker containers:
|
||||||
|
2
Home.md
2
Home.md
@ -1,7 +1,7 @@
|
|||||||
# Welcome to the eShopOnContainers wiki!
|
# Welcome to the eShopOnContainers wiki!
|
||||||
|
|
||||||
## Roadmap
|
## Roadmap
|
||||||
https://github.com/dotnet/eShopOnContainers/wiki/Roadmap-and-Milestones-for-future-releases
|
https://github.com/dotnet/eShopOnContainers/wiki/01.-Roadmap-and-Milestones-for-future-releases
|
||||||
|
|
||||||
## Setting up your development environment for eShopOnContainers
|
## Setting up your development environment for eShopOnContainers
|
||||||
### Visual Studio 2017 and Windows based
|
### Visual Studio 2017 and Windows based
|
||||||
|
BIN
img/spa/npm-install.png
Normal file
BIN
img/spa/npm-install.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 25 KiB |
BIN
img/spa/task-runner-with-npm-extension.png
Normal file
BIN
img/spa/task-runner-with-npm-extension.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 39 KiB |
Loading…
x
Reference in New Issue
Block a user