I want to deploy my ASP.NET Core + Vue.js application in Azure App Service with a configured CI/CD GitHub account. I followed Microsoft's guide: https://learn.microsoft.com/en-us/visualstudio/javascript/tutorial-asp-net-core-with-vue?view=vs-2022#publish-the-project
I did everything as they said, but I encountered an error during the publish stage when pushing the repository to GitHub:
> [email protected] build
vue-cli-service build
'vue-cli-service' is not recognized as an internal or external command,
operable program or batch file.
C:\Users\runneradmin.nuget\packages\microsoft.visualstudio.javascript.sdk\0.5.74-alpha\Sdk\Sdk.targets(171,9): error MSB3073: The command "npm run build" exited with code 1. [D:\a\ThatsTime\ThatsTime\vueapp\vueapp.esproj]
Error: Process completed with exit code 1.
here is vueapp.esproj content:
<Project Sdk="Microsoft.VisualStudio.JavaScript.Sdk/0.5.74-alpha">
<PropertyGroup>
<StartupCommand>npm run serve</StartupCommand>
<JavaScriptTestRoot>.\</JavaScriptTestRoot>
<JavaScriptTestFramework>Jest</JavaScriptTestFramework>
<!-- Command to run on project build -->
<BuildCommand></BuildCommand>
<!-- Command to create an optimized build of the project that's ready for publishing -->
<ProductionBuildCommand>npm run build</ProductionBuildCommand>
<!-- Folder where production build objects will be placed -->
<BuildOutputFolder>$(MSBuildProjectDirectory)\..\webapi\wwwroot</BuildOutputFolder>
</PropertyGroup>
</Project>
here is webapi.csproj content:
<Project Sdk="Microsoft.NET.Sdk.Web">
<PropertyGroup>
<TargetFramework>net7.0</TargetFramework>
<Nullable>enable</Nullable>
<ImplicitUsings>enable</ImplicitUsings>
<EnableSdkContainerSupport>true</EnableSdkContainerSupport>
</PropertyGroup>
<ItemGroup>
<Folder Include="Models\" />
</ItemGroup>
<ItemGroup>
<PackageReference Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="7.0.17" />
<PackageReference Include="Microsoft.IdentityModel.Tokens" Version="7.5.0" />
</ItemGroup>
<ItemGroup>
<ProjectReference Include="..\vueapp\vueapp.esproj">
<ReferenceOutputAssembly>false</ReferenceOutputAssembly>
</ProjectReference>
</ItemGroup>
</Project>
package.json:
"name": "vueapp",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "node aspnetcore-https.js && vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@vueuse/components": "^10.9.0",
"@vueuse/core": "^10.9.0",
"core-js": "^3.8.3",
"jest": "^29.7.0",
"jest-editor-support": "^31.1.2",
"vue": "^3.2.13",
"vue-router": "^4.3.0"
}
I also tried to deploy using Web App + Azure Blob Storage, but nothing worked out. Can you help me fix the problem or maybe give some recommendations on how to deploy this in another way?