Pijplijnen voor JavaScript-apps

In dit artikel wordt uitgelegd hoe Azure Pipelines werkt met JavaScript-apps. Door Microsoft gehoste agents installeren vooraf veelgebruikte JavaScript-build -, test- en implementatiehulpprogramma's zoals npm, Node.js, Yarn en Gulp zonder dat u een infrastructuur hoeft in te stellen. U kunt ook zelf-hostende agents configureren.

Als u snel een pijplijn voor JavaScript wilt maken, raadpleegt u de quickstart voor JavaScript.

Installatieprogramma's voor knooppunt-tools

Als u Node.js- en NPM-versies wilt installeren die niet vooraf zijn geïnstalleerd of om de hulpprogramma's te installeren op zelf-hostende agents:

• Voer voor npm de npm i -g npm@version-number opdracht uit in uw pijplijn.
• Voeg voor Node.jsde taak Use Node.js ecosystem v1 (UseNode@1) toe aan uw pijplijn.

YAML

Als u een specifieke Node.js-versie wilt installeren, voegt u de volgende code toe aan uw azure-pipelines.yml-bestand :

- task: UseNode@1
  inputs:
    version: '16.x' # replace with the version you need

Notitie

Deze taak kan aanzienlijke tijd vereisen om bij te werken naar een nieuwere secundaire versie telkens wanneer de pijplijn wordt uitgevoerd. Door Microsoft gehoste agents worden regelmatig bijgewerkt. Gebruik deze taak dus alleen om specifieke Node-versies te installeren die niet vooraf zijn geïnstalleerd. Zie Software voor informatie over welke Node.js- en npm-versies vooraf zijn geïnstalleerd op door Microsoft gehoste agents.

Classic

Een specifieke Node.js-versie installeren in een klassieke pijplijn:

1. Selecteer op het tabblad Taken van uw pijplijn de taak waarmee uw buildtaken worden uitgevoerd en selecteer + vervolgens om een nieuwe taak toe te voegen.
2. Zoek en voeg in de taakcatalogus de installatietaak van hetNode.js hulpprogramma toe.
3. Geef onder Versiespecificatie in het scherm taakconfiguratie de versie op van de Node.js runtime die u wilt installeren.

Notitie

Nadat u de taak hebt toegevoegd, kunt u de taakversiekiezer boven aan het configuratiescherm neerzetten en de versie 1.* (preview) van de taak selecteren. Deze heet Use Node.js ecosystem. Als u deze taakversie gebruikt, gebruikt u het veld Versie om de gewenste Node.js runtimeversie op te geven.

Meerdere knooppuntversies gebruiken

YAML

U kunt de taak Node.js ecosysteem v1 gebruiken met een matrix strategie om uw app te bouwen en te testen op meerdere versies van Node.js. Zie configuratie voor meerdere taken voor meer informatie.

pool:
  vmImage: 'ubuntu-latest'
strategy:
  matrix:
    node_16_x:
      node_version: 16.x
    node_13_x:
      node_version: 18.x

steps:
- task: UseNode@1
  inputs:
    version: $(node_version)

- script: npm install

Classic

Als u uw app wilt bouwen en testen op meerdere versies van Node.js, raadpleegt u de configuratie voor meerdere taken.

Installatie van hulpprogramma voor afhankelijkheden

Als u hulpprogramma's voor ontwikkelingsafhankelijkheid hebt in uw project package.json of package-lock.json bestand, installeert u de hulpprogramma's en afhankelijkheden via npm. Het projectbestand definieert de exacte versie van de hulpprogramma's, onafhankelijk van andere versies die aanwezig zijn op de buildagent.

Als u deze hulpprogramma's wilt installeren op uw buildagent, gebruikt u een script, de npm-taak of een opdrachtregeltaak in uw pijplijn.

Een script gebruiken:

- script: npm install --only=dev

De npm-taak gebruiken:

- task: Npm@1
  inputs:
     command: 'install'

Hulpprogramma's die u op deze manier installeert, gebruiken de npm-pakketrunner npx , waarmee de hulpprogramma's in de PATH-resolutie worden gedetecteerd. In het volgende voorbeeld wordt de mocha testrunner aangeroepen en wordt de ontwikkelingsafhankelijkheidsversie gebruikt in plaats van de versie die globaal is geïnstalleerd.npm install -g

- script: npx mocha

Als u hulpprogramma's wilt installeren die niet zijn ingesteld als ontwikkelingsafhankelijkheden in package.json, voert u npm install -g uit vanuit een script in uw pijplijn. In het volgende voorbeeld wordt de nieuwste versie van de Angular CLI geïnstalleerd met behulp van npm. Andere scripts in de pijplijn kunnen vervolgens de Angular-opdrachten ng gebruiken.

- script: npm install -g @angular/cli

Notitie

Op door Microsoft gehoste Linux-agents voert u de opdracht vooraf met sudo, zoals sudo npm install -g.

Deze toolinstallatietaken worden bij iedere uitvoering van de pijplijn uitgevoerd, dus houd rekening met hun impact op de bouwtijden. Als de overhead de buildprestaties ernstig beïnvloedt, kunt u overwegen om zelf-hostende agents te gebruiken die vooraf zijn geconfigureerd met de hulpprogrammaversies die u nodig hebt.

Downloads van afhankelijkheidspakketten

U kunt Yarn of Azure Artifacts gebruiken om pakketten te downloaden uit het openbare NPM-register of een persoonlijk NPM-register dat u opgeeft in een *.npmrc-bestand . Als u een npm-register wilt opgeven, voegt u de URL toe aan het *.npmrc-bestand in uw codeopslagplaats.

NPM gebruiken

U kunt npm gebruiken om buildpakketten in uw pijplijn te downloaden op de volgende manieren:

• Voor de eenvoudigste manier om pakketten zonder verificatie te downloaden, voert u deze rechtstreeks uit npm install.
• Als u een geverifieerd register wilt gebruiken, voegt u de npm-taak toe.
• Als u vanuit taaklopers Gulp, Grunt of Maven wilt uitvoeren npm install , gebruikt u de npm-verificatietaak .

Notitie

Als uw npm-feed gebruikmaakt van verificatie, moet u een npm-serviceverbinding maken op het tabblad Services in De instellingen van Azure DevOps Project om de referenties te beheren.

Als u npm-pakketten rechtstreeks wilt installeren, gebruikt u het volgende script in azure-pipelines.yml. Als uw buildagent geen ontwikkelingsafhankelijkheden nodig heeft, kunt u de buildtijden versnellen door de --only=prod optie toe te voegen aan npm install.

- script: npm install --only=prod

Als u een privéregister wilt gebruiken dat is opgegeven in uw *.npmrc-bestand , voegt u de Npm@1 taak toe aan azure-pipelines.yml.

- task: Npm@1
  inputs:
    customEndpoint: <Name of npm service connection>

Als u registerreferenties wilt doorgeven aan npm-opdrachten via taaklopers zoals Gulp, voegt u de npmAuthenticate@0 taak toe aan azure-pipelines.yml voordat u de taakloper aanroept.

- task: npmAuthenticate@0
  inputs:
    customEndpoint: <Name of npm service connection>

Notitie

Door Microsoft gehoste agents gebruiken een nieuwe machine met elke build. Het herstellen van afhankelijkheden kan een aanzienlijke hoeveelheid tijd in beslag nemen. Om het probleem te verhelpen, kunt u Azure Artifacts of een zelf-hostende agent gebruiken met de pakketcache.

Als uw builds af en toe mislukken vanwege verbindingsproblemen wanneer u pakketten herstelt vanuit het npm-register, kunt u Azure Artifacts met upstream-bronnen gebruiken om de pakketten in de cache op te slaan. De referenties van de pipeline worden automatisch gebruikt door Azure Artifacts en zijn gewoonlijk afgeleid van het Project Collection Build Service-account.

Yarn gebruiken

Gebruik een script om Yarn te installeren voor het herstellen van afhankelijkheden. Yarn is vooraf geïnstalleerd op sommige door Microsoft gehoste agents. U kunt Yarn installeren en configureren op zelf-hostende agents zoals elk ander hulpprogramma.

- script: yarn install

U kunt ook de CLI of de Bash-taak in uw pijplijn gebruiken om Yarn aan te roepen.

JavaScript-compilers

JavaScript-apps maken gebruik van compilers zoals Babel en de TypeScript-compilertsc om broncode te converteren naar versies die kunnen worden gebruikt door de Node.js runtime of in webbrowsers. Als u een scriptobject hebt ingesteld in uw project package.json-bestand om uw compiler uit te voeren, kunt u het aanroepen in uw pijplijn.

- script: npm run compile

U kunt compilers ook rechtstreeks vanuit de pijplijn aanroepen met behulp van een script. Deze opdrachten worden uitgevoerd vanuit de hoofdmap van de gekloonde opslagplaats voor broncode.

- script: tsc --target ES6 --strict true --project tsconfigs/production.json

U kunt de npm-taak gebruiken om de code te bouwen als uw project package.json een compileerscript definieert. Als u geen compileerscript definieert, kunt u de Bash-taak gebruiken om uw code te compileren.

Het testen van modules

U kunt uw pijplijnen zo configureren dat uw JavaScript-tests worden uitgevoerd, zodat ze resultaten produceren in de JUnit XML-indeling. Vervolgens kunt u de resultaten publiceren met behulp van de taak Testresultaten publiceren .

Als uw testframework geen ondersteuning biedt voor JUnit-uitvoer, voegt u ondersteuning toe via een partnerrapportagemodule zoals mocha-junit-reporter. U kunt uw testscript bijwerken om de JUnit reporter te gebruiken, of deze opties doorgeven aan de taakdefinitie als de reporter opdrachtregelopties ondersteunt.

De volgende tabel bevat de meest gebruikte testlopers en de reporters die u kunt gebruiken om XML-resultaten te produceren:

Testloper	Reporters voor XML-rapporten
Mokka	mocha-junit-reporter cypress-multi-reporters
Jasmijn	jasmine-reporters
Jest	jest-junit jest-junit-reporter
Karma	karma-junit-reporter
Ava	tap-xunit

In het volgende voorbeeld wordt de mocha-junit-reporter gebruikt en wordt deze rechtstreeks aangeroepen mocha test met behulp van een script. Dit script produceert de JUnit XML-uitvoer op de standaardlocatie van ./test-results.xml.

- script: mocha test --reporter mocha-junit-reporter

Als u een test script in uw project package.json-bestand hebt gedefinieerd, kunt u het aanroepen met behulp van npm test.

- script: npm test

Testresultaten publiceren

Als u testresultaten wilt publiceren, gebruikt u de taak Testresultaten publiceren .

- task: PublishTestResults@2
  condition: succeededOrFailed()
  inputs:
    testRunner: JUnit
    testResultsFiles: '**/test-results.xml'

Resultaten van codedekking publiceren

Als in uw testscripts een hulpprogramma voor codedekking zoals Istanbul wordt uitgevoerd, voegt u de taak Publicatiecodedekkingsresultaten toe. U kunt vervolgens metrische gegevens over dekking bekijken in het overzicht van de build en HTML-rapporten downloaden voor verdere analyse.

De taak verwacht Cobertura- of JaCoCo-rapportage-uitvoer. Zorg ervoor dat uw hulpprogramma voor codedekking wordt uitgevoerd met de benodigde opties om bijvoorbeeld de juiste uitvoer --report coberturate genereren.

YAML

In het volgende voorbeeld wordt de opdrachtregelinterface Istanbul gebruikt samen met mocha-junit-reporter, en wordt npm test aangeroepen.

- script: |
    nyc --reporter=cobertura --reporter=html \
    npm test -- --reporter mocha-junit-reporter --reporter-options mochaFile=./test-results.xml
  displayName: 'Build code coverage report'

- task: PublishCodeCoverageResults@2
  inputs: 
    summaryFileLocation: '$(System.DefaultWorkingDirectory)/**/*coverage.xml'

Classic

Stel de besturingsopties voor de taak Testresultaten publiceren in om de taak uit te voeren, zelfs als een vorige taak mislukt, tenzij de implementatie is geannuleerd.

Van begin tot eind browsertesten

Uw pijplijn kan hulpprogramma's zoals Protractor of Karma gebruiken om tests uit te voeren in headless browsers en vervolgens testresultaten te publiceren. Volg deze stappen om browsertests te configureren en resultaten te publiceren:

1. Installeer een hoofdloze browserteststuurprogramma, zoals headless Chrome of Firefox, of een browsersimuleerde tool zoals PhantomJS, op de buildagent.
2. Configureer uw testframework om de optie voor uw hoofdloze browser of stuurprogramma te gebruiken volgens de documentatie van het hulpprogramma.
3. Configureer uw testframework om testresultaten met JUnit-indeling uit te voeren, meestal met een invoegtoepassing of configuratie van een reporter.
4. Voeg een script of CLI-taak toe om de headless-browser instanties te starten.
5. Voer de end-to-end-tests uit in de pijplijnfasen, samen met uw eenheidstests.
6. Publiceer de resultaten samen met uw eenheidstests met behulp van dezelfde taak testresultaten publiceren .

Verpakking en levering

Nadat u uw app hebt gebouwd en getest, kunt u het volgende doen:

• Upload de build-uitvoer naar Azure Pipelines.
• Een npm- of Maven-pakket maken en publiceren.
• Verpakt de build-uitvoer in een ZIP-archief voor implementatie naar een webtoepassing.

Bestanden publiceren naar Azure Pipelines

Als u de volledige werkmap wilt uploaden, voegt u de taak Build-artefacten publiceren toe aan uw azure-pipelines.yml-bestand .

- task: PublishBuildArtifacts@1
  inputs:
    PathtoPublish: '$(System.DefaultWorkingDirectory)'

Als u een subset van bestanden wilt uploaden, kopieert u eerst de benodigde bestanden uit de werkmap naar een faseringsmap met de taak Bestanden kopiëren en gebruikt u vervolgens de taak Build-artefacten publiceren .

- task: CopyFiles@2
  inputs:
    SourceFolder: '$(System.DefaultWorkingDirectory)'
    Contents: |
      **\*.js
      package.json
    TargetFolder: '$(Build.ArtifactStagingDirectory)'

- task: PublishBuildArtifacts@1

Een module publiceren naar een NPM-register

Als de uitvoer van uw project een npm module is voor andere projecten die moeten worden gebruikt en geen webtoepassing is, gebruikt u de npm-taak om de module te publiceren naar een lokaal register of naar het openbare NPM-register. Geef elke keer dat u publiceert een unieke naam/versiecombinatie op.

In het volgende voorbeeld wordt het script gebruikt om te publiceren naar het openbare NPM-register. In het voorbeeld wordt ervan uitgegaan dat u versiegegevens zoals npm-versie beheert via een package.json-bestand in versiebeheer.

- script: npm publish

In het volgende voorbeeld wordt er gepubliceerd naar een custom register, dat is gedefinieerd in het *.npmrc-bestand van uw opslagplaats. Stel een npm-serviceverbinding in om verificatiereferenties in de verbinding te injecteren terwijl de build wordt uitgevoerd.

- task: Npm@1
  inputs:
     command: publish
     publishRegistry: useExternalRegistry
     publishEndpoint: https://my.npmregistry.com

In het volgende voorbeeld wordt de module gepubliceerd naar een Azure DevOps Services-pakketbeheerfeed.

- task: Npm@1
  inputs:
     command: publish
     publishRegistry: useFeed
     publishFeed: https://my.npmregistry.com

Zie Npm-pakketten publiceren en hoe kan ik mijn npm-pakketten versieren als onderdeel van het buildproces voor meer informatie over versiebeheer en het publiceren van npm-pakketten.

Een web-app verpakken en implementeren

U kunt toepassingen verpakken om alle modules te bundelen met tussenliggende uitvoer en afhankelijkheden in statische assets die gereed zijn voor implementatie. Voeg een pijplijnfase toe na compilatie en testen om een hulpprogramma zoals webpack of de Angular CLI ng-build uit te voeren.

In het volgende voorbeeld wordt webpack aangeroepen. Om dit proces te laten werken, moet u ervoor zorgen dat webpack is geconfigureerd als een ontwikkelingsafhankelijkheid in uw package.json-projectbestand. Dit script wordt uitgevoerd webpack met de standaardconfiguratie, tenzij u een webpack.config.js bestand in de hoofdmap van uw project hebt.

- script: webpack

In het volgende voorbeeld wordt met npm run build het build script-object aangeroepen zoals dat is gedefinieerd in het projectbestand package.json. Met behulp van het scriptobject in uw project wordt de buildlogica verplaatst naar de broncode en uit de pijplijn.

- script: npm run build

U kunt ook de CLI - of Bash-taak in uw pijplijn gebruiken om uw verpakkingshulpprogramma aan te roepen, zoals webpack of Angular' s ng build.

Als u een *.zip bestandarchief wilt maken dat gereed is voor publicatie naar een web-app, gebruikt u de taak Archiefbestanden .

- task: ArchiveFiles@2
  inputs:
    rootFolderOrFile: '$(System.DefaultWorkingDirectory)'
    includeRootFolder: false

Als u dit archief wilt publiceren naar een web-app, raadpleegt u Implementeren in Azure App Service met behulp van Azure Pipelines.

JavaScript-frameworks

U kunt pakketten in uw pijplijn installeren ter ondersteuning van verschillende JavaScript-frameworks.

Angular

Voor Angular-apps kunt u Angular-specifieke opdrachten uitvoeren, zoals ng test, ng builden ng e2e. Als u Angular CLI-opdrachten in uw pijplijn wilt gebruiken, installeert u het angular/cli npm-pakket op de buildagent.

YAML

- script: |
    npm install -g @angular/cli
    npm install
    ng build --prod

Notitie

Op door Microsoft gehoste Linux-agents voert u de opdracht vooraf met sudo, zoals sudo npm install -g.

Classic

Voeg in een klassieke pijplijn de volgende taken toe en configureer deze:

• npm

  • Opdracht: custom
  • Argumenten:install -g @angular/cli

• npm

  • Opdracht: install

• bash

  • Type: inline
  • Script:ng build --prod

Voor tests in uw pijplijn die een browser vereisen, zoals het uitvoeren van Karma met de ng test commando, gebruikt u een headless browser in plaats van een standaardbrowser. In de Angular starter-app:

• Wijzig de browsers vermelding in het karma.conf.js projectbestand van browsers: ['Chrome'] in browsers: ['ChromeHeadless'].
• Wijzig de singleRun vermelding in het karma.conf.js projectbestand van false in true. Deze wijziging zorgt ervoor dat het Karma-proces stopt nadat het is uitgevoerd.

React en Vue

Alle afhankelijkheden voor React- en Vue-apps worden vastgelegd in uw package.json-bestand . Het azure-pipelines.yml-bestand bevat de standaardscripts npm .

- script: |
    npm install
  displayName: 'npm install'

- script: |
    npm run build
  displayName: 'npm build'

De buildbestanden bevinden zich in een nieuwe map, dist voor Vue of build voor React. In het volgende voorbeeld wordt een artefact gebouwd, wwwdat gereed is voor release. De pijplijn maakt gebruik van de taken gebruiken Node.js, bestand kopiëren, en Buildartefacten publiceren.

trigger:
- main

pool:
  vmImage: 'ubuntu-latest'

steps:
- task: UseNode@1
  inputs:
    version: '16.x'
  displayName: 'Install Node.js'

- script: npm install
  displayName: 'npm install'

- script: npm run build
  displayName: 'npm build'

- task: CopyFiles@2
  inputs:
    Contents: 'build/**' # Pull the build directory (React)
    TargetFolder: '$(Build.ArtifactStagingDirectory)'

- task: PublishBuildArtifacts@1
  inputs: 
    PathtoPublish: $(Build.ArtifactStagingDirectory) # dist or build files
    ArtifactName: 'www' # output artifact named www

Als u de app wilt vrijgeven, wijst u de releasetaak naar het dist of build artefact en gebruikt u de Azure-web-app-taak .

Webpack

U kunt een webpackconfiguratiebestand gebruiken om een compiler zoals Babel of TypeScript op te geven, om JavaScript XML (JSX) of TypeScript te transpileren naar gewone JavaScript en om uw app te bundelen.

YAML

- script: |
    npm install webpack webpack-cli --save-dev
    npx webpack --config webpack.config.js

Classic

Voeg in een klassieke pijplijn de volgende taken toe en configureer deze:

• npm

  • Opdracht: custom
  • Opdracht en argumenten:install -g webpack webpack-cli --save-dev

• bash

  • Type: inline
  • Script:npx webpack --config webpack.config.js

Taaklopers bouwen

Het is gebruikelijk om Gulp of Grunt te gebruiken als taaklopers om JavaScript-apps te bouwen en te testen.

Slok

Gulp is vooraf geïnstalleerd op door Microsoft gehoste agents.

YAML

U kunt de gulp opdracht uitvoeren in het YAML-pijplijnbestand.

- script: gulp # add any needed options

Als voor de stappen in uw gulpfile.js-bestand verificatie is vereist met een npm-register, voegt u de verificatietaak npm toe.

- task: npmAuthenticate@0
  inputs:
    customEndpoint: <Name of npm service connection>

- script: gulp

Als u JUnit- of xUnit-testresultaten naar de server wilt publiceren, voegt u de taak Testresultaten publiceren toe.

- task: PublishTestResults@2
  inputs:
    testResultsFiles: '**/TEST-RESULTS.xml'
    testRunTitle: 'Test results for JavaScript using gulp'

Als u resultaten van de codedekking naar de server wilt publiceren, voegt u de taak Codedekkingsresultaten publiceren toe. U vindt metrische dekkingsgegevens in de samenvatting van de build en u kunt HTML-rapporten downloaden voor verdere analyse.

- task: PublishCodeCoverageResults@1
  inputs: 
    codeCoverageTool: Cobertura
    summaryFileLocation: '$(System.DefaultWorkingDirectory)/**/*coverage.xml'
    reportDirectory: '$(System.DefaultWorkingDirectory)/**/coverage'

Classic

De eenvoudigste manier om een klassieke pijplijn te maken als uw app Gebruikmaakt van Gulp, is door de Node.js te gebruiken met een gulp-buildsjabloon wanneer u de pijplijn maakt. Met deze sjabloon worden automatisch verschillende taken toegevoegd om Gulp-opdrachten aan te roepen en artefacten te publiceren. Selecteer in de taak Codedekking inschakelen om codedekking in te schakelen met behulp van Istanbul.

Grunt

Grunt is vooraf geïnstalleerd op door Microsoft gehoste agents.

YAML

U kunt de grunt opdracht uitvoeren in het YAML-bestand.

- script: grunt # add any needed options

Als voor de stappen in uw Gruntfile.js-bestand verificatie is vereist met een npm-register, voegt u de verificatietaak npm toe.

- task: npmAuthenticate@0
  inputs:
    customEndpoint: <Name of npm service connection>

- script: grunt

Classic

De eenvoudigste manier om een klassieke pijplijn te maken als uw app Grunt gebruikt, is door de Node.js met Grunt-buildsjabloon te gebruiken wanneer u de pijplijn maakt. Met deze sjabloon worden automatisch verschillende taken toegevoegd om Gulp-opdrachten aan te roepen en artefacten te publiceren.

Selecteer in de taak de optie Publiceren naar Azure Pipelines om testresultaten te publiceren en selecteer Codedekking inschakelen om codedekking in te schakelen met behulp van Istanbul.

Probleemoplossingsproces

Als u uw project op uw ontwikkelcomputer kunt bouwen, maar het niet kunt bouwen in Azure Pipelines, verkent u de volgende mogelijke oorzaken en corrigerende acties.

• Controleer of de versies van Node.js en de taakloper op uw ontwikkelcomputer overeenkomen met de versies van de agent.

  U kunt opdrachtregelscripts node --version zoals in uw pijplijn opnemen om te controleren welke versies op de agent zijn geïnstalleerd. Gebruik de Use Node.js taak om dezelfde versie op de agent te installeren of voer npm install opdrachten uit om de versie van het hulpprogramma bij te werken.

• Als uw builds af en toe mislukken tijdens het herstellen van pakketten, heeft het NPM-register problemen of zijn er netwerkproblemen tussen het Azure-datacenter en het register. Ontdek of het gebruik van Azure Artifacts met een npm-register als upstream-bron de betrouwbaarheid van uw builds verbetert.

• Als u nvm gebruikt om verschillende versies van Node.js te beheren, overweeg dan om over te schakelen naar de taak Use Node.js (UseNode@1) in plaats daarvan. nvm is om historische redenen geïnstalleerd op de macOS-installatiekopieën. nvm beheert meerdere Node.js versies door shellaliassen toe te voegen en te wijzigen PATH, wat slecht communiceert met de manier waarop Azure Pipelines elke taak in een nieuw proces uitvoert. Zie Pijplijnuitvoeringen voor meer informatie.

  De Use Node.js taak verwerkt dit model correct. Als uw werk echter vereist dat u nvm gebruikt, kunt u het volgende script toevoegen aan het begin van elke pijplijn:

  steps:
  - bash: |
      NODE_VERSION=16  # or your preferred version
      npm config delete prefix  # avoid a warning
      . ${NVM_DIR}/nvm.sh
      nvm use ${NODE_VERSION}
      nvm alias default ${NODE_VERSION}
      VERSION_PATH="$(nvm_version_path ${NODE_VERSION})"
      echo "##vso[task.prependPath]$VERSION_PATH"
  

  node Vervolgens werken andere opdrachtregelprogramma's voor de rest van de pijplijntaak. In elke stap waarin u de nvm opdracht gebruikt, start u het script met de volgende code:

  - bash: |
      . ${NVM_DIR}/nvm.sh
      nvm <command>
  

Veelgestelde vragen

Hoe kan ik een pipelinefout oplossen met het bericht 'FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory'?

Dit fouttype treedt op wanneer het Node.js-pakket de limiet voor geheugengebruik overschrijdt. Voeg een variabele toe zoals NODE_OPTIONS en wijs deze een waarde van --max_old_space_size=16384 toe om het probleem op te lossen.

Hoe kan ik mijn npm-pakketten versien als onderdeel van het buildproces?

Een optie is om een combinatie van versiebeheer en npm-versie te gebruiken. Aan het einde van een pijplijnuitvoering kunt u uw opslagplaats bijwerken met de nieuwe versie. De volgende YAML-pijplijn heeft een GitHub-opslagplaats en het pakket wordt geïmplementeerd in npmjs. De build mislukt als er een onjuiste overeenkomst is tussen de pakketversie op npmjs en het package.json-bestand .

variables:
    MAP_NPMTOKEN: $(NPMTOKEN) # Mapping secret var

trigger:
- none

pool:
  vmImage: 'ubuntu-latest'

steps: # Checking out connected repo
- checkout: self
  persistCredentials: true
  clean: true
    
- task: npmAuthenticate@0
  inputs:
    workingFile: .npmrc
    customEndpoint: 'my-npm-connection'
    
- task: UseNode@1
  inputs:
    version: '16.x'
  displayName: 'Install Node.js'

- script: |
    npm install
  displayName: 'npm install'

- script: |
    npm pack
  displayName: 'Package for release'

- bash: | # Grab the package version
    v=`node -p "const p = require('./package.json'); p.version;"`
    echo "##vso[task.setvariable variable=packageVersion]$v"

- task: CopyFiles@2
  inputs:
      contents: '*.tgz'
      targetFolder: $(Build.ArtifactStagingDirectory)/npm
  displayName: 'Copy archives to artifacts staging directory'

- task: CopyFiles@2
  inputs:
    sourceFolder: '$(Build.SourcesDirectory)'
    contents: 'package.json' 
    targetFolder: $(Build.ArtifactStagingDirectory)/npm
  displayName: 'Copy package.json'

- task: PublishBuildArtifacts@1 
  inputs:
    PathtoPublish: '$(Build.ArtifactStagingDirectory)/npm'
    artifactName: npm
  displayName: 'Publish npm artifact'

- script: |  # Config can be set in .npmrc
    npm config set //registry.npmjs.org/:_authToken=$(MAP_NPMTOKEN) 
    npm config set scope "@myscope"
    # npm config list
    # npm --version
    npm version patch --force
    npm publish --access public

- task: CmdLine@2 # Push changes to GitHub (substitute your repo)
  inputs:
    script: |
      git config --global user.email "username@contoso.com"
      git config --global user.name "Azure Pipeline"
      git add package.json
      git commit -a -m "Test Commit from Azure DevOps"
      git push -u origin HEAD:main

Verwante inhoud

• Zie Package Management in Azure Artifacts voor meer informatie over Azure Artifacts en de Package Management-service.
• Zie Build-, release- en testtaken voor meer informatie over taken.