Dostosowywanie języka JavaScript dla usługi Azure Pipelines
Usługi Azure Pipelines można używać do tworzenia aplikacji JavaScript bez konieczności konfigurowania własnej infrastruktury. Narzędzia, których często używasz do kompilowania, testowania i uruchamiania aplikacji JavaScript — takich jak npm, Node, Yarn i Gulp — są wstępnie instalowane na agentach hostowanych przez firmę Microsoft w usłudze Azure Pipelines.
Aby uzyskać informacje o wersji Node.js i npm, która jest wstępnie zainstalowana, zapoznaj się z agentami hostowanymi przez firmę Microsoft. Aby zainstalować określoną wersję tych narzędzi na agentach hostowanych przez firmę Microsoft, dodaj zadanie Instalator narzędzi node do początku procesu. Możesz również użyć własnego agenta.
Aby utworzyć pierwszy potok przy użyciu języka JavaScript, zobacz przewodnik Szybki start dla języka JavaScript.
Używanie określonej wersji Node.js
Jeśli potrzebujesz wersji Node.js i narzędzia npm, która nie jest jeszcze zainstalowana w agencie hostowanym przez firmę Microsoft, użyj zadania instalatora narzędzia Node. Dodaj następujący fragment kodu do azure-pipelines.yml
pliku.
Uwaga
Hostowani agenci są regularnie aktualizowani i konfigurowanie tego zadania powoduje poświęcanie znacznego czasu na aktualizację do nowszej wersji pomocniczej przy każdym uruchomieniu potoku. Tego zadania należy używać tylko wtedy, gdy potrzebna jest określona wersja środowiska Node w potoku.
- task: UseNode@1
inputs:
version: '16.x' # replace this value with the version that you need for your project
Jeśli potrzebujesz wersji Node.js/npm, która nie jest jeszcze zainstalowana na agencie:
W potoku wybierz pozycję Zadania, wybierz fazę uruchamiającą zadania kompilacji, a następnie wybierz, + aby dodać nowe zadanie do tej fazy.
W katalogu zadań znajdź i dodaj zadanie Instalator narzędzi węzła.
Wybierz zadanie i określ wersję środowiska uruchomieniowego Node.js, które chcesz zainstalować.
Aby zaktualizować tylko narzędzie npm, uruchom npm i -g npm@version-number
polecenie w procesie kompilacji.
Korzystanie z wielu wersji węzłów
Aplikację można skompilować i przetestować w wielu wersjach środowiska Node za pomocą zadania instalatora narzędzia Node.
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
Zobacz Wykonywanie wielu konfiguracji.
Instalowanie narzędzi na agencie kompilacji
Jeśli masz narzędzia, które są zależnościami programistycznymi w projekcie package.json
lub package-lock.json
pliku, zainstaluj narzędzia i zależności za pomocą narzędzia npm. Dokładna wersja narzędzi jest definiowana w projekcie izolowana od innych wersji istniejących na agencie kompilacji.
Użyj skryptu lub zadania npm.
Instalowanie za pomocą skryptu za pomocą package.json
- script: npm install --only=dev
Instalowanie za pomocą zadania npm za pomocą programu package.json
- task: Npm@1
inputs:
command: 'install'
Uruchom narzędzia zainstalowane w ten sposób przy użyciu modułu uruchamiającego pakiety npm npx
, który wykrywa narzędzia zainstalowane w ten sposób w jego rozwiązaniu ścieżki. Poniższy przykład wywołuje mocha
moduł uruchamiający testy, ale szuka wersji zainstalowanej jako zależność programistycznej przed użyciem zainstalowanej globalnie wersji (za pośrednictwem npm install -g
programu ).
- script: npx mocha
Aby zainstalować narzędzia, których potrzebuje projekt, ale które nie są ustawione jako zależności programistyczne w programie package.json
, wywołaj metodę npm install -g
ze etapu skryptu w potoku.
Poniższy przykład instaluje najnowszą wersję interfejsu wiersza polecenia platformy Angular przy użyciu polecenia npm
. Pozostała część potoku może następnie używać ng
narzędzia z innych script
etapów.
Uwaga
W przypadku agentów systemu Linux hostowanych przez firmę Microsoft należy wstępnie poprzeć polecenie , sudo
na przykład sudo npm install -g
.
- script: npm install -g @angular/cli
Napiwek
Te zadania są uruchamiane za każdym razem, gdy potok jest uruchamiany, dlatego należy pamiętać o wpływie, jaki instalowanie narzędzi ma na czas kompilacji. Rozważ skonfigurowanie własnych agentów z wersją potrzebnych narzędzi, jeśli obciążenie staje się poważnym wpływem na wydajność kompilacji.
Użyj zadań npm lub wiersza polecenia w potoku, aby zainstalować narzędzia na agencie kompilacji.
Zarządzanie zależnościami
W kompilacji użyj usługi Yarn lub Azure Artifacts, aby pobrać pakiety z publicznego rejestru npm. Ten rejestr jest typem prywatnego rejestru npm określonego .npmrc
w pliku.
Korzystanie z narzędzia npm
Narzędzie npm można użyć w następujący sposób, aby pobrać pakiety dla kompilacji:
- Bezpośrednie uruchamianie
npm install
w potoku, ponieważ jest to najprostszy sposób pobierania pakietów z rejestru bez uwierzytelniania. Jeśli kompilacja nie wymaga zależności programowania od agenta do uruchomienia, możesz przyspieszyć czas kompilacji z opcją--only=prod
.npm install
- Użyj zadania npm. To zadanie jest przydatne w przypadku korzystania z uwierzytelnionego rejestru.
- Użyj zadania uwierzytelniania npm. To zadanie jest przydatne podczas uruchamiania
npm install
z wewnątrz modułów uruchamianych zadań — Gulp, Grunt lub Maven.
Jeśli chcesz określić rejestr npm, umieść adresy URL w .npmrc
pliku w repozytorium.
Jeśli źródło danych zostanie uwierzytelnione, utwórz połączenie usługi npm na karcie Usługi w ustawieniach projektu, aby zarządzać jego poświadczeniami.
Aby zainstalować pakiety npm za pomocą skryptu w potoku, dodaj następujący fragment kodu do elementu azure-pipelines.yml
.
- script: npm install
Aby użyć rejestru prywatnego określonego w .npmrc
pliku, dodaj następujący fragment kodu do azure-pipelines.yml
pliku .
- task: Npm@1
inputs:
customEndpoint: <Name of npm service connection>
Aby przekazać poświadczenia rejestru do poleceń npm za pośrednictwem modułów uruchamiaczy zadań, takich jak Gulp, przed wywołaniem modułu uruchamiającego zadania dodaj następujące zadanie azure-pipelines.yml
.
- task: npmAuthenticate@0
inputs:
customEndpoint: <Name of npm service connection>
Użyj zadania npm lub npm uwierzytelniania w potoku, aby pobrać i zainstalować pakiety.
Jeśli kompilacje czasami kończą się niepowodzeniem z powodu problemów z połączeniem podczas przywracania pakietów z rejestru npm, możesz użyć usługi Azure Artifacts ze źródłami nadrzędnymi i buforować pakiety. Poświadczenia potoku są automatycznie używane podczas nawiązywania połączenia z usługą Azure Artifacts. Te poświadczenia są zwykle pochodzące z konta usługi Project Collection Build Service .
Jeśli używasz agentów hostowanych przez firmę Microsoft, otrzymujesz nową maszynę za każdym razem, gdy uruchamiasz kompilację — co oznacza przywrócenie zależności za każdym razem, co może zająć dużo czasu. Aby rozwiązać ten problem, możesz użyć usługi Azure Artifacts lub własnego agenta — możesz skorzystać z zalet korzystania z pamięci podręcznej pakietów.
Korzystanie z usługi Yarn
Użyj etapu skryptu, aby wywołać usługę Yarn w celu przywrócenia zależności. Usługa Yarn jest wstępnie instalowana na niektórych agentach hostowanych przez firmę Microsoft. Można go zainstalować i skonfigurować na własnych agentach, podobnie jak w przypadku dowolnego innego narzędzia.
- script: yarn install
Użyj interfejsu wiersza polecenia lub zadania powłoki Bash w potoku, aby wywołać usługę Yarn.
Uruchamianie kompilatorów języka JavaScript
Kompilatory, takie jak Babel i kompilator TypeScripttsc
, umożliwiają konwertowanie kodu źródłowego na wersje używane przez środowisko uruchomieniowe Node.js lub w przeglądarkach internetowych.
Jeśli masz obiekt skryptu skonfigurowany w pliku projektupackage.json
, który uruchamia kompilator, wywołaj go w potoku przy użyciu zadania skryptu.
- script: npm run compile
Kompilatory można wywoływać bezpośrednio z potoku przy użyciu zadania skryptu. Te polecenia są uruchamiane z katalogu głównego sklonowanego repozytorium kodu źródłowego.
- script: tsc --target ES6 --strict true --project tsconfigs/production.json
Użyj zadania npm w potoku, jeśli masz skrypt kompilowania zdefiniowany w projekcie package.json do skompilowania kodu. Użyj zadania powłoki Bash , aby skompilować kod, jeśli nie masz oddzielnego skryptu zdefiniowanego w konfiguracji projektu.
Uruchamianie testów jednostkowych
Skonfiguruj potoki tak, aby uruchamiały testy języka JavaScript, aby wygenerowały wyniki sformatowane w formacie XML narzędzia JUnit. Następnie możesz opublikować wyniki przy użyciu wbudowanego zadania publikowania wyników testu.
Jeśli platforma testowa nie obsługuje danych wyjściowych narzędzia JUnit, dodaj obsługę za pośrednictwem modułu raportowania partnerów, takiego jak mocha-junit-reporter. Możesz zaktualizować skrypt testowy, aby użyć reportera JUnit lub jeśli reporter obsługuje opcje wiersza polecenia, przekaż te opcje do definicji zadania.
W poniższej tabeli wymieniono najczęściej używane moduły uruchamiające testy oraz reporterów, których można użyć do generowania wyników XML:
Moduł uruchamiający testy | Reporterzy do tworzenia raportów XML |
---|---|
Mocha | mocha-junit-reporter cypress-multi-reporters |
jaśmin | jasmine-reporterzy |
jest | jest-junit jest-junit-reporter |
Karma | karma-junit-reporter |
Ava | tap-xunit |
W poniższym przykładzie użyto narzędzia mocha-junit-reporter i wywołuje się mocha test
bezpośrednio przy użyciu skryptu. Ten skrypt generuje dane wyjściowe XML JUnit w domyślnej ./test-results.xml
lokalizacji .
- script: mocha test --reporter mocha-junit-reporter
Jeśli skrypt został zdefiniowany test
w pliku package.json projektu, można go wywołać przy użyciu polecenia npm test
.
- script: npm test
Publikowanie wyników testu
Aby opublikować wyniki, użyj zadania Publikuj wyniki testu.
- task: PublishTestResults@2
condition: succeededOrFailed()
inputs:
testRunner: JUnit
testResultsFiles: '**/test-results.xml'
Publikowanie wyników pokrycia kodu
Jeśli skrypty testowe uruchamiają narzędzie pokrycia kodu, takie jak Stambuł, dodaj zadanie Publikuj wyniki pokrycia kodu. W tym celu możesz znaleźć metryki pokrycia w podsumowaniu kompilacji i pobrać raporty HTML w celu dalszej analizy. Zadanie oczekuje danych wyjściowych raportowania Cobertura lub JaCoCo, dlatego upewnij się, że narzędzie pokrycia kodu działa z odpowiednimi opcjami generowania odpowiednich danych wyjściowych. Na przykład --report cobertura
.
W poniższym przykładzie użyto nyc, interfejsu wiersza polecenia Stambułu wraz z mocha-junit-reporter i wywołuje npm test
polecenie.
- 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'
Użyj zadań Publikowanie wyników testów i Publikowanie wyników pokrycia kodu w potoku, aby opublikować wyniki testów wraz z wynikami pokrycia kodu przy użyciu Stambułu.
Ustaw opcje sterowania zadania Publikuj wyniki testu, aby uruchomić zadanie, nawet jeśli poprzednie zadanie nie powiodło się, chyba że wdrożenie zostało anulowane.
Kompleksowa przeglądarka testowa
Uruchamianie testów w przeglądarkach bezgłowych w ramach potoku za pomocą narzędzi takich jak Protractor lub Karma. Następnie opublikuj wyniki kompilacji w usłudze Azure DevOps, wykonując następujące kroki:
- Zainstaluj sterownik testowania przeglądarki bez głowy, taki jak headless Chrome lub Firefox, lub narzędzie do pozorowania przeglądarki, takie jak PhantomJS, na agencie kompilacji.
- Skonfiguruj platformę testową tak, aby korzystała z wybranej opcji przeglądarki/sterownika bez głowy zgodnie z dokumentacją narzędzia.
- Skonfiguruj strukturę testową (zwykle z wtyczką lub konfiguracją reportera) w celu wyprowadzania wyników testu sformatowanego w formacie JUnit.
- Skonfiguruj zadanie skryptu, aby uruchamiać wszystkie polecenia interfejsu wiersza polecenia potrzebne do uruchamiania wystąpień przeglądarki bez głowy.
- Uruchom kompleksowe testy na etapach potoku wraz z testami jednostkowymi.
- Opublikuj wyniki przy użyciu tego samego zadania Publikuj wyniki testu obok testów jednostkowych.
Tworzenie pakietów aplikacji internetowych
Pakowanie aplikacji w celu dołączenia wszystkich modułów aplikacji z pośrednimi danymi wyjściowymi i zależnościami do zasobów statycznych gotowych do wdrożenia. Dodaj etap potoku po kompilacji i testach, aby uruchomić narzędzie, takie jak webpack lub kompilacja ng , przy użyciu interfejsu wiersza polecenia platformy Angular.
Pierwszy przykład wywołuje metodę webpack
. Aby wykonać tę pracę, upewnij się, że webpack
jest ona skonfigurowana jako zależność programowa w pliku projektu package.json. Jest to uruchamiane webpack
z konfiguracją webpack.config.js
domyślną, chyba że masz plik w folderze głównym projektu.
- script: webpack
W następnym przykładzie użyto zadania npm do wywołania npm run build
obiektu skryptu zdefiniowanego build
w package.json projektu. Użycie obiektów skryptów w projekcie powoduje przeniesienie logiki kompilacji do kodu źródłowego i z potoku.
- script: npm run build
Użyj interfejsu wiersza polecenia lub zadania powłoki Bash w potoku, aby wywołać narzędzie do tworzenia pakietów, takie jak webpack
lub angular.ng build
Implementowanie platform JavaScript
Angular
W przypadku aplikacji Angular można uwzględnić polecenia specyficzne dla platformy Angular, takie jak test ng, kompilacja ng i ng e2e. Aby użyć poleceń interfejsu wiersza polecenia platformy Angular w potoku, zainstaluj pakiet npm angular/cli na agencie kompilacji.
Uwaga
W przypadku agentów systemu Linux hostowanych przez firmę Microsoft należy wstępnie poprzeć polecenie , sudo
na przykład sudo npm install -g
.
- script: |
npm install -g @angular/cli
npm install
ng build --prod
Dodaj następujące zadania do potoku:
npm
- Polecenie:
custom
- Polecenia i argumenty:
install -g @angular/cli
- Polecenie:
npm
- Polecenie:
install
- Polecenie:
Bash
- Typ:
inline
- Skrypt:
ng build --prod
- Typ:
W przypadku testów w potoku, które wymagają uruchomienia przeglądarki, na przykład polecenia ng test w aplikacji startowej, która uruchamia karmę, użyj przeglądarki bezgłowej zamiast standardowej przeglądarki. W aplikacji startowej Angular:
browsers
Zmień wpis w pliku projektu karma.conf.js zbrowsers: ['Chrome']
nabrowsers: ['ChromeHeadless']
.singleRun
Zmień wpis w pliku projektu karma.conf.js z wartościfalse
natrue
. Ta zmiana pomaga upewnić się, że proces Karma zatrzymuje się po jego uruchomieniu.
React i Vue
Wszystkie zależności aplikacji React i Vue są przechwytywane w pliku package.json . Plik azure-pipelines.yml zawiera standardowy skrypt Node.js:
- script: |
npm install
displayName: 'npm install'
- script: |
npm run build
displayName: 'npm build'
Pliki kompilacji znajdują się w nowym folderze dist
(dla programu Vue) lub build
(dla platformy React). Ten fragment kodu tworzy artefakt — www
który jest gotowy do wydania. Używa on zadań Instalatora węzła, Kopiowania plikówi Publikowania artefaktów kompilacji .
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
Aby go zwolnić, wskaż zadanie wydania do artefaktu dist
lub build
i użyj zadania Wdrażanie aplikacji internetowej platformy Azure.
Pakiet webpack
Możesz użyć pliku konfiguracji pakietu webpack do określenia kompilatora, takiego jak Babel lub TypeScript, do transpilowania plików JSX lub TypeScript do zwykłego języka JavaScript i tworzenia pakietu aplikacji.
- script: |
npm install webpack webpack-cli --save-dev
npx webpack --config webpack.config.js
Dodaj następujące zadania do potoku:
npm
- Polecenie:
custom
- Polecenia i argumenty:
install -g webpack webpack-cli --save-dev
- Polecenie:
Bash
- Typ:
inline
- Skrypt:
npx webpack --config webpack.config.js
- Typ:
Moduły uruchamiane zadań kompilacji
Często do kompilowania i testowania aplikacji JavaScript używa się narzędzia Gulp lub Grunt jako modułu uruchamiającego zadania.
Gulp
Gulp jest wstępnie instalowany na agentach hostowanych przez firmę Microsoft. gulp
Uruchom polecenie w pliku YAML:
- script: gulp # include any additional options that are needed
Jeśli kroki opisane w pliku gulpfile.js wymagają uwierzytelniania z rejestrem npm:
- task: npmAuthenticate@0
inputs:
customEndpoint: <Name of npm service connection>
- script: gulp # include any additional options that are needed
Dodaj zadanie Publikuj wyniki testu, aby opublikować wyniki testów JUnit lub xUnit na serwerze.
- task: PublishTestResults@2
inputs:
testResultsFiles: '**/TEST-RESULTS.xml'
testRunTitle: 'Test results for JavaScript using gulp'
Dodaj zadanie Publikuj wyniki pokrycia kodu, aby opublikować wyniki pokrycia kodu na serwerze. Metryki pokrycia można znaleźć w podsumowaniu kompilacji i pobrać raporty HTML w celu dalszej analizy.
- task: PublishCodeCoverageResults@1
inputs:
codeCoverageTool: Cobertura
summaryFileLocation: '$(System.DefaultWorkingDirectory)/**/*coverage.xml'
reportDirectory: '$(System.DefaultWorkingDirectory)/**/coverage'
Najprostszym sposobem utworzenia potoku, jeśli aplikacja używa narzędzia Gulp, jest użycie Node.js z szablonem kompilacji gulp podczas tworzenia potoku. Ten szablon automatycznie dodaje różne zadania do wywoływania poleceń Gulp i publikowania artefaktów. W zadaniu wybierz pozycję Włącz pokrycie kodu, aby włączyć pokrycie kodu przy użyciu Stambułu.
Grunt
Program Grunt pobiera preinstalację na agentach hostowanych przez firmę Microsoft. Aby uruchomić polecenie grunt w pliku YAML:
- script: grunt # include any additional options that are needed
Jeśli kroki w Gruntfile.js
pliku wymagają uwierzytelniania z rejestrem npm:
- task: npmAuthenticate@0
inputs:
customEndpoint: <Name of npm service connection>
- script: grunt # include any additional options that are needed
Najprostszym sposobem utworzenia potoku, jeśli aplikacja używa gruntu, jest użycie szablonu kompilacji Node.js z gruntem podczas tworzenia potoku. Spowoduje to automatyczne dodanie różnych zadań w celu wywoływania poleceń Gulp i publikowania artefaktów. W zadaniu wybierz opcję Publikuj w programie TFS/Team Services , aby opublikować wyniki testów, a następnie wybierz pozycję Włącz pokrycie kodu , aby włączyć pokrycie kodu przy użyciu Stambułu.
Pakowanie i dostarczanie kodu
Po skompilowaniu i przetestowaniu aplikacji możesz przekazać dane wyjściowe kompilacji do usługi Azure Pipelines, utworzyć i opublikować pakiet npm lub Maven albo spakować dane wyjściowe kompilacji w pliku .zip na potrzeby wdrożenia w aplikacji internetowej.
Publikowanie plików w usłudze Azure Pipelines
Aby przekazać cały katalog roboczy plików, użyj zadania Publish Build Artifacts (Publikuj artefakty kompilacji ) i dodaj następujące polecenie do pliku azure-pipelines.yml
.
- task: PublishBuildArtifacts@1
inputs:
PathtoPublish: '$(System.DefaultWorkingDirectory)'
Aby przekazać podzbiór plików, najpierw skopiuj niezbędne pliki z katalogu roboczego do katalogu przejściowego za pomocą zadania Kopiuj pliki , a następnie użyj zadania Publikowanie artefaktów kompilacji.
- task: CopyFiles@2
inputs:
SourceFolder: '$(System.DefaultWorkingDirectory)'
Contents: |
**\*.js
package.json
TargetFolder: '$(Build.ArtifactStagingDirectory)'
- task: PublishBuildArtifacts@1
Publikowanie modułu w rejestrze npm
Jeśli dane wyjściowe projektu są modułem używanym npm
przez inne projekty, a nie aplikacją internetową, użyj zadania npm , aby opublikować moduł w rejestrze lokalnym lub w publicznym rejestrze npm. Podaj unikatową kombinację nazwy/wersji za każdym razem, gdy publikujesz.
Przykłady
W pierwszym przykładzie przyjęto założenie, że zarządzasz informacjami o wersji (na przykład za pośrednictwem wersji npm) przez zmiany package.json
w pliku w kontroli wersji. W poniższym przykładzie użyto zadania skryptu do opublikowania w rejestrze publicznym.
- script: npm publish
Następny przykład jest publikowany w rejestrze niestandardowym zdefiniowanym w pliku repozytorium .npmrc
. Skonfiguruj połączenie usługi npm, aby wstrzyknąć poświadczenia uwierzytelniania do połączenia podczas uruchamiania kompilacji.
- task: Npm@1
inputs:
command: publish
publishRegistry: useExternalRegistry
publishEndpoint: https://my.npmregistry.com
Ostatni przykład publikuje moduł w kanale zarządzania pakietami usługi Azure DevOps Services.
- task: Npm@1
inputs:
command: publish
publishRegistry: useFeed
publishFeed: https://my.npmregistry.com
Aby uzyskać więcej informacji na temat przechowywania wersji i publikowania pakietów npm, zobacz Publikowanie pakietów npm i Jak mogę wersję pakietów npm w ramach procesu kompilacji?.
Wdrażanie aplikacji internetowej
Aby utworzyć archiwum plików .zip, które jest gotowe do publikowania w aplikacji internetowej, użyj zadania Archive Files :
- task: ArchiveFiles@2
inputs:
rootFolderOrFile: '$(System.DefaultWorkingDirectory)'
includeRootFolder: false
Aby opublikować to archiwum w aplikacji internetowej, zobacz Wdrażanie aplikacji internetowej platformy Azure.
Publikowanie artefaktów w usłudze Azure Pipelines
Użyj zadania Publish Build Artifacts (Publikowanie artefaktów kompilacji), aby opublikować pliki z kompilacji w usłudze Azure Pipelines.
Publikowanie w rejestrze npm
Aby utworzyć i opublikować pakiet npm, użyj zadania npm. Aby uzyskać więcej informacji na temat przechowywania wersji i publikowania pakietów npm, zobacz Publikowanie pakietów npm.
Wdrażanie aplikacji internetowej
Aby utworzyć archiwum plików .zip, które jest gotowe do publikowania w aplikacji internetowej, użyj zadania Archiwum plików. Aby opublikować to archiwum w aplikacji internetowej, zobacz Wdrażanie aplikacji internetowej platformy Azure.
Kompilowanie i wypychanie obrazu do rejestru kontenerów
Po pomyślnym utworzeniu kodu źródłowego i pomyślnym wykonaniu testów jednostkowych można również skompilować obraz i wypchnąć go do rejestru kontenerów.
Rozwiązywanie problemów
Jeśli możesz skompilować projekt na maszynie deweloperów, ale masz problemy z kompilowaniem go w usłudze Azure Pipelines, zapoznaj się z następującymi potencjalnymi przyczynami i akcjami naprawczymi:
Sprawdź, czy wersje Node.js i moduł uruchamiający zadania na maszynie deweloperów są zgodne z wersjami agenta. Możesz uwzględnić skrypty wiersza polecenia, takie jak
node --version
w potoku, aby sprawdzić, co jest zainstalowane na agencie. Aby wdrożyć tę samą wersję na agencie, użyj Instalatora narzędzi węzła (zgodnie z wyjaśnieniem w tym przewodniku) lub uruchomnpm install
polecenia, aby zaktualizować narzędzia do żądanych wersji.Jeśli kompilacje kończą się niepowodzeniem sporadycznie podczas przywracania pakietów, rejestr npm ma problemy lub występują problemy z siecią między centrum danych platformy Azure i rejestrem. Nie możemy kontrolować tych czynników. Dowiedz się, czy korzystanie z usługi Azure Artifacts z rejestrem npm jako źródłem nadrzędnym zwiększa niezawodność kompilacji.
Jeśli używasz
nvm
narzędzia do zarządzania różnymi wersjami Node.js, rozważ przełączenie do zadania Instalator narzędzi węzła. (nvm
jest instalowany ze względów historycznych na obrazie systemu macOS).nvm
zarządza wieloma wersjami Node.js, dodając aliasy powłoki i zmieniającPATH
element , który działa źle ze sposobem uruchamiania każdego zadania w nowym procesie przez usługę Azure Pipelines.Zadanie Instalator narzędzi węzła obsługuje ten model poprawnie. Jeśli jednak praca wymaga użycia
nvm
polecenia , możesz dodać następujący skrypt na początku każdego potoku:steps: - bash: | NODE_VERSION=16 # or whatever your preferred version is 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
Następnie i inne narzędzia wiersza polecenia działają dla pozostałej części zadania potoku. W każdym kroku, w którym używasznvm
polecenia, uruchom skrypt przy użyciu następującego kodu:- bash: | . ${NVM_DIR}/nvm.sh nvm <command>
Często zadawane pytania
.: Gdzie mogę dowiedzieć się więcej o usłudze Azure Artifacts i usłudze zarządzania pakietami?
1: Zarządzanie pakietami w usłudze Azure Artifacts
.: Gdzie mogę dowiedzieć się więcej o zadaniach?
Elementy: Zadania kompilacji, wydania i testowania
.: Jak mogę naprawić błąd potoku z komunikatem "BŁĄD KRYTYCZNY: CALL_AND_RETRY_LAST Alokacja nie powiodła się — sterta javaScript z pamięci"?
1: Ten typ błędu występuje, gdy pakiet Node.js przekracza limit użycia pamięci. Aby rozwiązać ten problem, dodaj zmienną podobną NODE_OPTIONS
do i przypisz jej wartość --max_old_space_size=16384.
.: Jak mogę wersję pakietów npm w ramach procesu kompilacji?
1: Jedną z opcji jest użycie kombinacji kontroli wersji i wersji npm. Na końcu uruchomienia potoku możesz zaktualizować repozytorium przy użyciu nowej wersji. W tym języku YAML istnieje repozytorium GitHub, a pakiet zostanie wdrożony w usłudze npmjs. Kompilacja kończy się niepowodzeniem, jeśli istnieje niezgodność między wersją pakietu w pliku npmjs i pliku package.json
.
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