I created a Web Api Asp.Net Core Project in server folder and an Angular-Cli Project in client folder.
In local:
I launch the WebAPI with IIS Express and my angular project with
ng serve --proxy-config proxy.config.json*.In my Angular App, in environments/environment.ts, to be able to get the ApiUrl using environment.apiUrl (proxy doesnt work for websocket used with SignalR), I added a new parameter:
apiUrl: "http://localhost:49402/"File structure:
My project is available on git too: https://github.com/ranouf/AspNetCore-SignalR/
On Azure:
I created a new WebApp,
I configured the deployment options, each time master is modified, the Web App is deployed which works well for my WebApi.
Problem:
How to deploy my Angular App in the Web App on Azure?
My thinking:
I added a post build command which will build my angular app in the wwwroot folder only in release mode. This solution works in local but doesnt work on Azure:
<PropertyGroup Condition=" '$(Configuration)' == 'Release' ">
<PostBuildEvent>
cd "$(MSBuildProjectDirectory)/../../client"
npm install
npm run build
</PostBuildEvent>
</PropertyGroup>
And in startup.cs, I added
app.UseDefaultFiles();
app.UseStaticFiles();
Constraint:
I have to separate my 2 projects in Local, I can't use the webpack microsoft angular template.
Thanks for your help. Cedric
Edit
So I m still working on it.
It s really hard to debug and understand what s happening on Azure Portal. The log on Deployment doesnt give the build output.
My new pre build command is :
echo "$(ProjectDir)..\..\client"
cd $(ProjectDir)..\..\client
echo "npm install"
npm install
echo "ng build"
ng build --env=prod --prod --output-path=$(ProjectDir)
But still, nothing is copied in the server folder ...
Please, can you share your thinking? How can I deploy my angular App using Deployment Option in Azure portal?
Edit 2
So, I saw no solution online, and no one answer here too, so what I want to do first seems to not be possible.
I try something else, the kudu deployment script. You need to add two file:
.deployment with this lines inside:
[config] command = deploy.cmddeploy.cmd:
@if "%SCM_TRACE_LEVEL%" NEQ "4" @echo off :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: :: Setup :: ----- setlocal enabledelayedexpansion IF NOT DEFINED DEPLOYMENT_SOURCE ( SET DEPLOYMENT_SOURCE=%ARTIFACTS%\repository ) IF NOT DEFINED DEPLOYMENT_TARGET ( SET DEPLOYMENT_TARGET=%ARTIFACTS%\wwwroot ) :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: :: Deployment :: ---------- echo Source: %DEPLOYMENT_SOURCE%... echo Deployment: in %DEPLOYMENT_TARGET%... echo Server off touch %DEPLOYMENT_TARGET%\App_Offline.htm pushd "%DEPLOYMENT_SOURCE%\src\client" echo npm install --production call :ExecuteCmd npm install --production IF !ERRORLEVEL! NEQ 0 goto error echo Deploy client call :ExecuteCmd npm run build-azure IF !ERRORLEVEL! NEQ 0 goto error popd echo Deploy API call :ExecuteCmd dotnet publish src\server\AspNetCore-SignalR.Api\ -o %DEPLOYMENT_TARGET% IF !ERRORLEVEL! NEQ 0 goto error :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: :: End :: --- IF !ERRORLEVEL! NEQ 0 goto error goto end :: Execute command routine that will echo out when error :ExecuteCmd setlocal set _CMD_=%* call %_CMD_% if "%ERRORLEVEL%" NEQ "0" echo Failed exitCode=%ERRORLEVEL%, command=%_CMD_% exit /b %ERRORLEVEL% :error endlocal echo An error has occurred during web site deployment. call :exitSetErrorLevel call :exitFromFunction 2>nul :exitSetErrorLevel exit /b 1 :exitFromFunction () :end endlocal echo Finished successfully.
There is 2 good points:
- the deployment succeded
- all the files (DotNet Core publish + Angular publish) are in wwwroot
There is 1 BIG problem:
- I can access to the API using swagger (www.website.com/swagger) but the angular App is not available (error 404 on www.webiste.com)
- If I remove the web.config, the Angular App is now available, but not swagger or the API anymore.
How to make understand to the web.config that I want both work Angular App and Swagger?
