npm install - jest doesn't exist in Azure Pipeline - node.js

Apologies in advance that I can't share source for this one:
I've got a client that has to use Azure DevOps Pipelines to build a github enterprise hosted project.
It is a perfectly regular node.js project with jest specified as a devDependency in package.json.
When the npm install runs on an Azure Pipeline, jest doesn't get installed. I created a local x64 linux agent on Ubuntu 18 on my desktop, and it doesn't get installed their either but when I manually run npm install inside the /s/ directory it's all okay.
What is Azure Devops doing to the script that this is the result?

What is Azure Devops doing to the script that this is the result?
Test to run Npm install in Azure Pipeline and local machine, it seems that they have the same behavior. The Jest will be installed in node_modules folder.
Here are my steps, you could refer to it.
The File structure. I also add the jest to devDependency in package.json.
"devDependencies": {
"enzyme": "^3.3.0",
"enzyme-adapter-react-16": "^1.1.1",
"enzyme-to-json": "^3.3.3",
"jest": "^22.4.3"
}
Use the Npm install task in Azure Pipeline.
- task: Npm#1
displayName: 'npm install'
inputs:
workingDir: package
verbose: false
Run the pipeline and the Jest will be installed in the node_modules folder.
By the way, I test the same steps on the Microsoft-hosted agents: ubuntu-18.04 and it could work fine.
Updates
For running Npm install with the Script:
Here is an example:
steps:
- script: |
cd $(build.sourcesdirectory)/package
npm install
displayName: 'Command Line Script'
The first step is used to navigate to the source folder(contains package.json file).
Then the jest will be installed.

Related

Selfhosted Azure DevOps Agent running as NetworkService not able to complete npm install and npm build

The agent is not able to build and generate the build folder for react project while using the windows platform with Microsoft and self hosted agent but works fine with ubuntu.
This is the linux yml file with Microsoft agent
https://gist.github.com/yogeswaran-gnrgy/0354d455e6c85d387281eb75d1a326f1
This is the windows yml file with Microsoft agent
https://gist.github.com/yogeswaran-gnrgy/816b9f06dbe0039c07ad1293d2fce141
This is the log generated during the build step using Microsoft agent
https://gist.github.com/yogeswaran-gnrgy/acbc3c2a268ea3b514cc423726b0a751
In case of Self-hosted agent it has both npm and node installed. What can be the problem
In Linux
- script: |
echo Executing install
npm install
echo Executing build
npm run build
displayName: 'Building the project'
When used as script npm install and npm build works fine only in Linux. For windows, it must be like
- task: Npm#1
displayName: 'Installing dependencies'
inputs:
verbose: false
customCommand: install
- task: Npm#1
displayName: 'Building the project'
inputs:
command: custom
verbose: false
customCommand: run build

Azure pipeline for npm publish does not work as expected

I am a bit new to azure and today I am trying to create a pipeline for publishing npm package to azure artifactory.
The issue is - that after pipeline successfully built, I can see the published package in the artifacts. However, published package is almost empty.
There is only package.json and readme.md. No dist folder at all.
Here is my Pipeline:
# Node.js
# Build a general Node.js project with npm.
# 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
npm publish
displayName: 'npm install and build and publish'
Also, when I build the project locally and run npm publish - the package is published as it should,all files in place.
Is there is something I am doing wrong ?
Finally I found the issue.
The Pipeline definition was actually right, besides one little thing:
versionSpec: '10.x'
Version of the Node was incorrect! The pretty old one. Originally the definition was copied from one of the azure official manuals, so the version was from some really old year.
versionSpec: '14.x'
And build was successful with all files on their place.
Hope that will be helpful for somebody here.
when publishing packages to npm, you need to authenticate with your credential. You could run it successfully on local because of the .npmrc file saved on your computer. When running npm publish on CI, the file doesn't exist, which results in an error. Please try the following steps:
Generate an automation access token from this URL: https://www.npmjs.com/
Go to your repo, and add a file named ".npmrc", enter the content with //registry.npmjs.org/:_authToken={your-token-value}
Notice:
It is recommended to set the access token as an environment variable in Pipeline library.
Please use lowercase words as the package's name in package.json. Otherwise you will receive a 400 error.

Define custom npm install procedure for azure/webapps-deploy#v2

My project currently contains 2 apps. The first is the application Backend (NestJS) and the second is the client (VueJS).
The current folder structure follows:
Root (NestJS)
./client/ (VueJS)
When I am deploying my app to Azure App Service I am using the azure/webapps-deploy#v2 action. It's procedure is to run npm install in the root of the project but I need it to also run in the sub project containing the client packages. How can this be done? Are there any arguments to provide the webapps deploy action to include that addition npm install command?
You could try add the commands directly in your workflow:
- name: npm install, build, and test
run: |
npm install
npm run build --if-present
npm run test --if-present
cd ./client/mern_azure_example # go to your client package
npm install # run npm install under your client package
But it takes very long time.

Azure DevOps - how to build bundles using webpack during deployment

I have been trying to deploy an web app to local IIS by using Azure DevOps Repos and Pipelines.
I would like to build bundles using webpack on Azure DevOps service rather than uploading already bundled javascript, style files to Azure Repos.
FYI,
App uses ASP.NET Core 2.2, webpack 4.30, webpack-cli 3.3.2, and configs with webpack.config.js (contains bunch of settings to create bundles in 'dist' folder)
and javascript, style files are in wwwroot folder.
So far it works fine if I upload to Repos with already bundled files in "dist" folder.
But I would like to upload only source files and let Azure DevOps Repos or Pipelines to build bundles and create artifacts with it.
So far, I have been trying to use azure-pipelines.yml
- task: NodeTool#0
inputs:
versionSpec: '12.x'
- task: CmdLine#2
inputs:
script: |
cd (folder)
cd (other folder-where package.json is located)
npm install -g webpack webpack-cli --save-dev
npm install
npx webpack --config webpack.config.js
or
- task: CmdLine#2
inputs:
script: |
cd (folder)
cd (folder)
npm install webpack webpack-cli --save-dev
webpack
npm run build (which is just 'webpack')
both don't work. It seems npm install works but it doesn't even run the webpack part.
because I use 'webpack-messages' on webpack.config.js file so I am expecting some messages such as "Building something bundle..." but it does not show any message regarding webpack process.
Below messages are from a build log.
Starting: Webpack install and build
==============================================================================
Task : Command line
Description : Run a command line script using Bash on Linux and macOS and cmd.exe on Windows
Version : 2.163.0
Author : Microsoft Corporation
Help : https://learn.microsoft.com/azure/devops/pipelines/tasks/utility/command-line
==============================================================================
Generating script.
========================== Starting Command Output ===========================
"C:\windows\system32\cmd.exe" /D /E:ON /V:OFF /S /C "CALL "d:\a\_temp\fc9874eb-1e72-4a4f-82af-2d3b62451eb7.cmd""
npm WARN rollback Rolling back readable-stream#2.3.6 failed (this is probably harmless): EPERM: operation not permitted, scandir 'D:\a\1\s\something\something\node_modules\fsevents\node_modules'
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.2.11 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#1.2.11: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
+ webpack-cli#3.3.11
+ webpack#4.41.6
added 388 packages from 217 contributors and audited 5566 packages in 31.587s
3 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
I tried also on release pipeline.
I added tasks such as 'npm install', 'npm custom', or 'command line' or 'webpack' extension from Dealogic, but none of them works since I can't specify where package.json is located on the Azure DevOps Cloud machine.
Please let me know if it is possible, and if so, how to do it.
According to Microsoft's documentation, it seems that a "webpack" command in the script section of your YAML pipeline should do the trick:
- script: webpack
The condition is: "To have this work, make sure that webpack is configured as a development dependency in your package.json project file. This will run webpack with the default configuration unless you have a webpack.config.js file in the root folder of your project."
They also mention you need to do this after your compilation and tests. There's a suggestion that you can move this logic out of the pipeline and into your code by using script objects in package.json:
- script: npm run build
Source: Microsoft docs
EDIT: The way I've done it is the with the 2nd recommendation. I have this in my MVC ASP.NET project file:
<Target Name="AfterBuild">
<Exec Condition="$(Configuration) == 'Debug'" Command="npm run build-dev" />
<Exec Condition="$(Configuration) == 'Release'" Command="npm run build-prod"/>
</Target>
and build-prod for example is just a script in the webpack.config.js:
"build-prod": "SET NODE_ENV=production && webpack -p --color"
build-dev has the -d argument instead but that's all...

Do I have to npm install in every step in a bitbucket pipeline that I need to use an npm command

I have a bitbucket pipelines yml that I have step for running my test script and a step to run a serverless deploy script. Do I need to npm install at each step or will the first npm install carry through and suffice for each subsequent step. Further than that, what is happening under the hood? I know Docker container is created; does each step just update the container?
- step:
name: Test and Build
script:
- npm install --no-package-lock
- npm run test
- step:
name: Deploy Serverless
script:
- npm i serverless -g
- npm install --no-package-lock
- npm run deploy
Can you implement it like the documentation: https://confluence.atlassian.com/bitbucket/caching-dependencies-895552876.html
The functionality is there. Let me know if it doesn't work for you still.
Each step in the pipe creates a separate docker container which pulls in your branch. Using the cache option will allow your pipe to skip the install when building the container for the second step by pulling node_modules from the cache. You must still include the npm install line in each step to tell the pipe to use the cache if it exists.

Resources