How to publish an Angular and dotnet Web api project in VS code

Question

Following these tutorials: tutorial1 - tutorial2 I now have a working hello world project that works great. Problem is that I dont know how to publish the whole project so I can upload the files to my webhost provider.

This is my project in VS code (the app.component.html holds the content):

dotnet publish --outdir C:\temp publishes to the folder, but the html file is missing (not in the src folder either):

ng build builds the angular project to wwwroot. In this folder there is an index.html file, but it is empty:

When I normally run the project from VS code with F5, it seems like the dotnet core Kestrel web server does not host the files anywhere, but instead use the files directly in the project. So how do you publish a project like this, so I can upload the files to my webhost? Just like when I push F5 in VS code.

Thanks!

Answer 1

您可以在Visual Studio 2017中使用de Angular模板。 您必须更改index.cshtml，如

<!-- comment this line
<app asp-prerender-module="ClientApp/dist/main-server">Loading...</app>
    -->
<!--just only-->
<app>Loading...</app>

将package.json更改为使用angular 5

"devDependencies": {
    "@angular/animations": "5.1.2",
    "@angular/common": "5.1.2",
    "@angular/compiler": "5.1.2",
    "@angular/compiler-cli": "^5.1.2",
    "@angular/core": "5.1.2",
    "@angular/forms": "5.1.2",
    "@angular/http": "5.1.2",
    "@angular/platform-browser": "5.1.2",
    "@angular/platform-browser-dynamic": "5.1.2",
    "@angular/platform-server": "5.1.2",
    "@angular/router": "5.1.2",
    "@ngtools/webpack": "1.9.2",
    "@types/chai": "4.0.10",
    "@types/jasmine": "2.8.2",
    "@types/quill": "1.3.5",
    "@types/webpack-env": "1.13.3",
    "angular2-router-loader": "0.3.5",
    "angular2-template-loader": "0.6.2",
    "aspnet-prerendering": "^3.0.1",
    "aspnet-webpack": "^2.0.1",
    "awesome-typescript-loader": "3.4.1",
    "chai": "4.1.2",
    "core-js": "^2.5.3",
    "css": "2.2.1",
    "css-loader": "0.28.7",
    "es6-shim": "0.35.3",
    "event-source-polyfill": "0.0.12",
    "expose-loader": "0.7.4",
    "extract-text-webpack-plugin": "3.0.2",
    "file-loader": "1.1.6",
    "html-loader": "0.5.1",
    "isomorphic-fetch": "2.2.1",
    "jasmine-core": "2.8.0",
    "json-loader": "0.5.7",
    "karma": "2.0.0",
    "karma-chai": "0.1.0",
    "karma-chrome-launcher": "2.2.0",
    "karma-cli": "1.0.1",
    "karma-jasmine": "1.1.1",
    "karma-webpack": "2.0.9",
    "preboot": "6.0.0-beta.1",
    "quill": "1.3.4",
    "raw-loader": "0.5.1",
    "reflect-metadata": "0.1.10",
    "rxjs": "5.5.6",
    "style-loader": "0.19.1",
    "to-string-loader": "1.1.5",
    "typescript": "^2.6.2",
    "url-loader": "0.6.2",
    "webpack": "^3.10.0",
    "webpack-hot-middleware": "2.21.0",
    "webpack-merge": "4.1.1",
    "zone.js": "0.8.18"
  },
  "dependencies": {
    "bootstrap-css-only": "4.0.0-beta.2", //<--if you want to use bootstrap.css but not all bootstrap
    "ng2-dnd": "^5.0.2"
  }

我认为这都是