Pipeline releases in azure devops (Web App Service) deployed in wrong folder - node.js

When releasing an new update for my web app service with azure devops the code is not showing in the wwwroot directory but its placed in a subfolder /s/
Problem:
https://i.ibb.co/MVjXG73/pasted-Image.png
My settings:
https://i.ibb.co/YhQd7bG/devops.png
In application settings i added:
SCM_TARGET_PATH = D:\home\site\wwwroot
I created a yml file with the following build:
trigger:
- master
pool:
vmImage: "Ubuntu-16.04"
steps:
- task: NodeTool#0
inputs:
versionSpec: "8.x"
displayName: "Install Node.js"
- script: |
npm install
displayName: "npm install"
- task: ArchiveFiles#2
inputs:
rootFolderOrFile: "$(System.DefaultWorkingDirectory)"
archiveType: "zip"
archiveFile: "$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip"
replaceExistingArchive: true
- task: PublishBuildArtifacts#1
inputs:
pathToPublish: "$(Build.ArtifactStagingDirectory)"
artifactName: "drop"
I need the code to end up in the wwwroot directory to be published live.
Thanks in advance!

Try adding below line to ArchiveFiles#2 task
includeRootFolder: false

Related

How to deploy two zipped Functions to the same Azure Function App?

I trying to deploy two zipped Functions to the same Azure Function App called http-trigger-api-test and the result is that the first one gets deployed but then it is replaced by the second function.
I have the tasks in the following yaml file:
- stage: Build
displayName: Build stage for Azure Function
jobs:
- job: Build
steps:
- task: ArchiveFiles#2
displayName: 'Archive HttpTriggerApi Azure Function'
inputs:
rootFolderOrFile: 'azure/azure_functions/HttpTriggerApi/function_code'
includeRootFolder: false
archiveType: zip
archiveFile: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
replaceExistingArchive: true
- task: ArchiveFiles#2
displayName: 'Archive HttpTriggerApiWeb Azure Function'
inputs:
rootFolderOrFile: 'azure/azure_functions/HttpTriggerApi/function_code_web'
includeRootFolder: false
archiveType: zip
archiveFile: $(Build.ArtifactStagingDirectory)/$(Build.BuildId)2.zip
replaceExistingArchive: true
- upload: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
displayName: 'Upload Azure Function Full Stack'
artifact: full_stack_deploy
- upload: $(Build.ArtifactStagingDirectory)/$(Build.BuildId)2.zip
displayName: 'Upload Azure Function Web Stack'
artifact: web_deploy
- stage: TEST
displayName: Deploy stage Test
variables:
- group: optimizelyeventconnector-test-group
jobs:
- deployment: Deploy
displayName: Deploy
environment: optimizelyeventconnector-test
pool:
vmImage: $(vmImageName)
strategy:
runOnce:
deploy:
steps:
- task: AzureCLI#1
displayName: 'Deploy Azure Function Full Stack'
inputs:
azureSubscription: 'test-group-SPN'
scriptType: 'ps'
scriptLocation: 'inlineScript'
inlineScript: |
az functionapp deployment source config-zip -g test-group -n http-trigger-api-test --src $(Pipeline.Workspace)/full_stack_deploy/$(Build.BuildId).zip
- task: AzureCLI#1
displayName: 'Deploy Azure Function Web Stack'
inputs:
azureSubscription: 'test-group-SPN'
scriptType: 'ps'
scriptLocation: 'inlineScript'
inlineScript: |
az functionapp deployment source config-zip -g test-group -n http-trigger-api-test --src $(Pipeline.Workspace)/web_deploy/$(Build.BuildId)2.zip
I have read some questions where it is suggested not to pack several functions into one function app unless they are related. In my case, both functions are related.
Any suggestion, comment or improvement to this questions is welcome.
After some research I found the solution.
I had to structure my function app in the following way:
- main_function_app
- functions
- Full_Stack
- configAPI.json
- configAPITest.json
- function.json
- index.js
- Web
- configAPI.json
- configAPITest.json
- function.json
- index.js
- host.json
- local.settings.json
- package-lock.json
- package.json
- proxies.json
- utils.js
When deploying to azure, you need to install node, dependencies, zip the files and publish them.
- stage: Build
displayName: Build stage for Azure Function
jobs:
- job: Build
displayName: Build
pool:
vmImage: $(vmImageName)
steps:
- task: NodeTool#0
inputs:
versionSpec: '14.x'
displayName: 'Install Node.js'
- task: Bash#3
inputs:
targetType: 'inline'
script: 'npm install --prefix azure/azure_functions/HttpTriggerApi/main_function_app/functions'
- task: ArchiveFiles#2
displayName: 'Build Azure Functions and Dependencies'
inputs:
rootFolderOrFile: 'azure/azure_functions/HttpTriggerApi/main_function_app/functions'
includeRootFolder: false
archiveType: zip
archiveFile: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
replaceExistingArchive: true
- upload: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
displayName: 'Publish Azure Functions Artifact'
artifact: functions

Azure DevOps - Deployment problems

I am trying to deploy a new code in an existing function on Azure but for some reason I am getting a Green/Pass pipeline but when I request the URL I got error 404.
What I have done:
Setup the function manually
Run a Pipeline with the stages:
a) mvn package
b) zip content of azure functions in the target
c) Deploy artifact from agent to the pipeline
d) Deploy artifact into a function using snipped code from microsoft.
The pipeline gets a green state and the function has been deployed:
Starting: AzureFunctionApp
==============================================================================
Task : Azure Functions
Description : Update a function app with .NET, Python, JavaScript, PowerShell, Java based web applications
Version : 1.195.0
Author : Microsoft Corporation
Help : https://aka.ms/azurefunctiontroubleshooting
==============================================================================
Got service connection details for Azure App Service:'test'
Trying to update App Service Application settings. Data: {"WEBSITE_RUN_FROM_PACKAGE":"https://teststorage.blob.core.windows.net/azure-pipelines-deploy/package_1639741028399.zip?***"}
Updated App Service Application settings.
Updated WEBSITE_RUN_FROM_PACKAGE Application setting to https://teststorage.blob.core.windows.net/azure-pipelines-deploy/package_1639743928399.zip?***
Syncing triggers for function app
Sync triggers for function app completed successfully
Successfully added release annotation to the Application Insight :test
App Service Application URL: http://test.azurewebsites.net
Finishing: AzureFunctionApp
but when I request the URL it fails, also I check the functions section in the portal , and the function that was there (deployed manually) got removed.
Note:
The code is fine because I can deploy manually the same code and it is working fine, via pipeline is not working.
Pipeline code:
pool:
vmImage: ubuntu-latest
variables:
serviceName: test
jdkVersion: "1.11"
stages:
- stage:
displayName: Build
jobs:
- job: "Deployment_draft"
steps:
- task: MavenAuthenticate#0
displayName: "Maven Authenticate"
inputs:
artifactsFeeds: test-artifactory
- task: ArchiveFiles#2
inputs:
rootFolderOrFile: $(Build.SourcesDirectory)/${{ variables.serviceName }}/target/azure-functions/${{ variables.serviceName }}
includeRootFolder: true
archiveType: 'zip'
archiveFile: '$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip'
replaceExistingArchive: true
- task: PublishBuildArtifacts#1
inputs:
PathtoPublish: '$(Build.ArtifactStagingDirectory)'
ArtifactName: '${{ variables.serviceName }}'
publishLocation: 'Container'
- task: AzureFunctionApp#1
inputs:
azureSubscription: 'SubscriptionTest(Subscription ID)'
appType: 'functionAppLinux'
appName: 'test'
deploymentMethod: zipDeploy
package: '$(Build.ArtifactStagingDirectory)/**/*.zip'
rootFolderorFile - Enter the root folder or file path to add to the archive. If a folder, everything under the folder will be added to the resulting archive. Default value: $(Build.BinariesDirectory)
I have slightly modified your pipeline.
pool:
vmImage: ubuntu-latest
variables:
serviceName: test
jdkVersion: "1.11"
stages:
- stage:
displayName: Build
jobs:
- job: "Deployment_draft"
steps:
- task: MavenAuthenticate#0
displayName: "Maven Authenticate"
inputs:
artifactsFeeds: test-artifactory
- stage : deploy
jobs:
- job:
displayName : Function App update
steps:
- task: ArchiveFiles#2
inputs:
rootFolderOrFile: '$(Build.SourcesDirectory)'
includeRootFolder: true
archiveType: 'zip'
archiveFile: '$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip'
replaceExistingArchive: true
- task: PublishBuildArtifacts#1
inputs:
PathtoPublish: '$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip'
ArtifactName: '${{ variables.serviceName }}'
publishLocation: 'Container'
- task: AzureFunctionApp#1
inputs:
azureSubscription: 'SubscriptionTest(Subscription ID)'
appType: 'functionAppLinux'
appName: 'test'
deploymentMethod: zipDeploy
package: '$(Build.ArtifactStagingDirectory)/**/*.zip'
Refer here

Vue.js does not start in Azure App Service

I currently have a pipeline in Azure Dev Ops configured to build, copy, archive, and then deploy a Vue.js app to an Azure App Service running on Linux. When I SSH into the server I do see the outputs of the build appearing successfully in the wwwroot folder but when I pull up the URL of the App Service I'm just shown the default landing page. Below are screenshots of my wwwroot folder, the page I'm seeing when I pull up the URL and a copy of the yml file for the pipeline. Is there something else missing from the yml file that I need to add to tell the app service to start the vue.js app by chance, I'm fairly new to this stuff.
# Build a Node.js project that uses Vue.
# Add steps that analyze code, save build artifacts, deploy, and more:
# https://learn.microsoft.com/azure/devops/pipelines/languages/javascript
trigger:
- master
pool:
vmImage: ubuntu-latest
steps:
- task: NodeTool#0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- script: |
npm install
npm run build
displayName: 'npm install and build'
workingDirectory: $(Build.SourcesDirectory)/client-app
- task: CopyFiles#2
inputs:
Contents: '$(Build.SourcesDirectory)/client-app/dist/**'
TargetFolder: '$(Build.ArtifactStagingDirectory)'
flattenFolders: true
- task: ArchiveFiles#2
inputs:
rootFolderOrFile: '$(Build.ArtifactStagingDirectory)'
includeRootFolder: false
archiveType: 'zip'
archiveFile: '$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip'
replaceExistingArchive: true
verbose: true
- task: AzureRmWebAppDeployment#4
inputs:
ConnectionType: 'AzureRM'
azureSubscription: 'Azure subscription 1 (f719f76c-c23e-4160-aa93-914eb7851fdb)'
appType: 'webAppLinux'
WebAppName: 'trashbot'
packageForLinux: '$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip'
You need to add startup command on portal.
pm2 serve /home/site/wwwroot --no-daemon --spa
Related Posts:
1. Application is not loading when deployed via azure app service
2. Default Documents (custom 404) on Azure AppService Linux website

Excluding Certain Files in Azure CI Pipeline (YAML)

I have a CI pipeline (YAML) that builds a repo that will deploy into an existing Azure Function. The CI pipeline is doing it is job. However, after it is done, and I go to Function App -> App files -> I can see the azure-pipeline.yml is included in there (or i think it was included in the build process). I have tried using paths and exclude but they dont work. My question is, how do I exclude only that azure-pipeline.yml so that after the pipeline is done building, the azure-pipeline.yml is not in App files in Function App. Below is my YAML
trigger:
branches:
include:
- master
paths:
exclude:
- README.md
- azure-pipelines.yml
variables:
# Azure Resource Manager connection created during pipeline creation
azureSubscription: 'DevOps-Test'
# Function app name
functionAppName: 'test'
# Agent VM image name
vmImageName: 'vs2017-win2016'
# Working Directory
workingDirectory: '$(System.DefaultWorkingDirectory)/'
stages:
- stage: Build
displayName: Build stage
jobs:
- job: Build
displayName: Build
pool:
vmImage: $(vmImageName)
steps:
- powershell: |
if (Test-Path "extensions.csproj") {
dotnet build extensions.csproj --output ./$(workingDirectory)/bin
}
displayName: 'Build extensions'
- task: ArchiveFiles#2
displayName: 'Archive files'
inputs:
rootFolderOrFile: $(workingDirectory)
includeRootFolder: false
archiveType: zip
archiveFile: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
replaceExistingArchive: true
- publish: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
artifact: drop
- task: DownloadBuildArtifacts#0
inputs:
buildType: 'current'
downloadType: 'single'
artifactName: 'drop'
downloadPath: '$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip'
- task: AzureFunctionApp#1
displayName: 'Azure functions app deploy'
inputs:
azureSubscription: '$(azureSubscription)'
appType: functionApp
appName: $(functionAppName)
package: '$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip'
The following syntax means file README.md or azure-pipelines.yml won't trigger the build. It doesn't mean file README.md or azure-pipelines.yml are excluded in the working directory.
trigger:
branches:
include:
- master
paths:
exclude:
- README.md
- azure-pipelines.yml
I've noticed you tried archiving folder $(workingDirectory), and workingDirectory defined in variable which was actually $(System.DefaultWorkingDirectory)/. System.DefaultWorkingDirectory is the local path on the agent where your source code files are downloaded.
Obviously, file README.md and azure-pipelines.yml are in the source code, so they are archived too. You could add a CopyFiles task before ArchiveFiles task to copy files you need from a source folder to a target folder using match patterns, then archive the target folder. For example:
- task: CopyFiles#2
displayName: 'Copy Files to: $(Build.ArtifactStagingDirectory) '
inputs:
SourceFolder: '$(workingDirectory)'
Contents: |
**/*
!*.md
!*.yml
TargetFolder: '$(Build.ArtifactStagingDirectory) '
- task: ArchiveFiles#2
displayName: 'Archive files '
inputs:
rootFolderOrFile: '$(Build.ArtifactStagingDirectory) '
Take a look here
- powershell: |
if (Test-Path "extensions.csproj") {
dotnet build extensions.csproj --output ./$(workingDirectory)/bin
}
displayName: 'Build extensions'
- task: ArchiveFiles#2
displayName: 'Archive files'
inputs:
rootFolderOrFile: $(workingDirectory)
includeRootFolder: false
archiveType: zip
archiveFile: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
replaceExistingArchive: true
You produce your ouptut here ./$(workingDirectory)/bin but you zipped rootFolderOrFile: $(workingDirectory). Please change it to rootFolderOrFile: $(workingDirectory)/bin.
EDIT
Please add this before calling archive
- script: |
rm README.md
rm azure-pipelines.yml
workingDirectory: $(workingDirectory)
So you will remove them from folder which you later archive.

Build and publish angular app to Azure app service results in Application Error

I'm battling with getting an angular app to build and then publish to an Azure resource. The Pipeline runs "successfully" but I am getting the ":( Application Error" when accessing the site. If I view wwwroot via Azure Portal -> Advanced Tools I ~~see the entire repo~~ see nothing:
If I look at the directory via CLI - I see the files
The downloaded artifact appears correct:
[EDIT - updated .yml file] Right now, my pipeline yml file is
variables:
System.Debug: true
trigger:
- develop
pool:
vmImage: 'ubuntu-latest'
steps:
- task: NodeTool#0
inputs:
versionSpec: '10.x'
displayName: 'Install Node.js'
- script: |
npm install -g #angular/cli
npm install
ng build
displayName: 'npm install and build'
- task: ArchiveFiles#2
inputs:
rootFolderOrFile: '$(System.DefaultWorkingDirectory)/dist/question-ui'
includeRootFolder: false
archiveType: 'zip'
archiveFile: '$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip'
replaceExistingArchive: true
- task: PublishBuildArtifacts#1
inputs:
pathtoPublish: '$(Build.ArtifactStagingDirectory)'
artifactName: app
- task: DownloadBuildArtifacts#0
inputs:
buildType: 'current'
downloadType: 'single'
artifactName: 'app'
downloadPath: '$(System.ArtifactsDirectory)'
- task: AzureRmWebAppDeployment#4
inputs:
ConnectionType: 'AzureRM'
azureSubscription: 'qt-question-ui - Azure'
appType: 'webAppLinux'
WebAppName: 'qt-question-ui'
deployToSlotOrASE: true
ResourceGroupName: 'DEV_QTv2'
SlotName: 'production'
packageForLinux: '$(System.ArtifactsDirectory)/app/$(Build.BuildId).zip'
RuntimeStack: 'NODE|10-lts'
I've updated this as I progress, thinking I'm getting closer.

Resources