diff --git a/blog-posts/en/2026-04-02-angular-aspnet-core-getting-started-guide/angular-aspnet-core-getting-started-guide.md b/blog-posts/en/2026-04-02-angular-aspnet-core-getting-started-guide/angular-aspnet-core-getting-started-guide.md index 9bfb90cc..41f083f2 100644 --- a/blog-posts/en/2026-04-02-angular-aspnet-core-getting-started-guide/angular-aspnet-core-getting-started-guide.md +++ b/blog-posts/en/2026-04-02-angular-aspnet-core-getting-started-guide/angular-aspnet-core-getting-started-guide.md @@ -280,9 +280,9 @@ dotnet run ```bash cd angular -yarn -yarn create-dynamic-bundles -yarn start +pnpm +pnpm create-dynamic-bundles +pnpm start ``` Navigate to `http://localhost:4200` and log in with the default admin credentials. You will see a fully working enterprise application. diff --git a/docs/en/Deployment-Angular-Publish-Azure.md b/docs/en/Deployment-Angular-Publish-Azure.md index 24c226f7..8824f0cd 100644 --- a/docs/en/Deployment-Angular-Publish-Azure.md +++ b/docs/en/Deployment-Angular-Publish-Azure.md @@ -86,15 +86,15 @@ Select "**your-host-app-service-name**" and click "**OK**", then click "**Publis Here are the quick steps to publish the **AngularUI** to the Azure -- Run the `yarn` command to restore packages -- Run the `npm run publish` command to publish Angular app. +- Run the `pnpm install` command to restore packages +- Run the `pnpm run publish` command to publish Angular app. - Copy the web.config file that is placed in **angular** folder to **dist** folder - Configure the **angular/dist/assets/appconfig.json** with your production URLs. - Upload all files under "angular/dist" folder to your website on Azure created for the Angular UI. ### Prepare The Publish Folder -Run the `yarn` command to restore packages and run the `npm run publish` to publish the Angular app. +Run the `pnpm install` command to restore packages and run the `pnpm run publish` to publish the Angular app. ### Copy the web.config diff --git a/docs/en/Deployment-Angular.md b/docs/en/Deployment-Angular.md index 38cdc7c7..d3608d68 100644 --- a/docs/en/Deployment-Angular.md +++ b/docs/en/Deployment-Angular.md @@ -4,10 +4,10 @@ ASP.NET Zero depends on [angular-cli](https://cli.angular.io/) for development & deployment. It uses angular-cli commands to build and publish its Angular client application. ASP.NET Zero also minifies and bundles some assets (JS and CSS files) using [gulp](https://gulpjs.com/) before publishing the Angular client application since those assets are loaded dynamically at runtime. In order to publish the Angular client application below commands must be run respectively. -1. run ```yarn``` command in the root directory of Angular project. -2. run ```npm run publish``` command in the root directory of Angular project. +1. run ```pnpm install``` command in the root directory of Angular project. +2. run ```pnpm run publish``` command in the root directory of Angular project. -In the Web.Host project, run ```npm run create-bundles``` to bundle and minify JS and CSS files before final deployment. +In the Web.Host project, run ```pnpm run create-bundles``` to bundle and minify JS and CSS files before final deployment. ASP.NET Zero also provides a merged solution for ASP.NET Core & Angular version. In that solution, Angular client side application is included in the server side Host project. Those two applications, server side API project and Angular client side application, can be published at once and can be hosted together under the same website. diff --git a/docs/en/Deployment-Mvc-Core-Azure.md b/docs/en/Deployment-Mvc-Core-Azure.md index 67ea27a0..c321d94b 100644 --- a/docs/en/Deployment-Mvc-Core-Azure.md +++ b/docs/en/Deployment-Mvc-Core-Azure.md @@ -30,15 +30,15 @@ On Azure portal, go to SQL databases menu and create a new empty database. If yo Here are the quick steps to publish the **Web.Mvc Application** to the Azure. -- Run the ```yarn``` command in the root directory of MVC project. -- Run the `npm run build` to bundle and minify the js/css files +- Run the ```pnpm install``` command in the root directory of MVC project. +- Run the `pnpm run build` to bundle and minify the js/css files - Run the migrations on the Azure - Configure the **.Web.Mvc/appsettings.production.json** - Publish the application to Azure ### Run the `npm run build` -First run the ```yarn``` command in the root directory of MVC project to install client side dependencies. Then, run the `npm run build` to bundle and minify the script and style files. +First run the ```pnpm install``` command in the root directory of MVC project to install client side dependencies. Then, run the `pnpm run build` to bundle and minify the script and style files. ### Run Migrations on The Azure @@ -98,7 +98,7 @@ Since we migrated the database when deploying Admin application, we will not do ### NPM Packages -First run the ```yarn``` command in the root directory of MVC project to install client side dependencies. Then, run the `npm run build` to bundle and minify the script and style files. +First run the ```pnpm install``` command in the root directory of MVC project to install client side dependencies. Then, run the `pnpm run build` to bundle and minify the script and style files. ### Configure the appsettings.production.json diff --git a/docs/en/Deployment-React-Docker.md b/docs/en/Deployment-React-Docker.md index c59dcb0d..613df7b7 100644 --- a/docs/en/Deployment-React-Docker.md +++ b/docs/en/Deployment-React-Docker.md @@ -6,14 +6,14 @@ ASP.NET Zero solution has a **build folder** which contains scripts to **build & * Node.js (LTS version recommended) * Docker Desktop installed and running -* Packages installed (`yarn` or `npm install`) +* Packages installed (`pnpm install` or `npm install`) ## Building the React Application Before creating a Docker image, build the React application: ```bash -yarn build +pnpm build # or npm run build ``` diff --git a/docs/en/Deployment-React-Publish-Azure.md b/docs/en/Deployment-React-Publish-Azure.md index b99093a3..baaa6592 100644 --- a/docs/en/Deployment-React-Publish-Azure.md +++ b/docs/en/Deployment-React-Publish-Azure.md @@ -100,7 +100,7 @@ This URL should point to your published Host API application. Run the following commands to build the React application: ```bash -yarn && yarn build +pnpm install && pnpm build # or npm install && npm run build ``` diff --git a/docs/en/Deployment-React-Publish-IIS.md b/docs/en/Deployment-React-Publish-IIS.md index bb03d2af..ef1b1b30 100644 --- a/docs/en/Deployment-React-Publish-IIS.md +++ b/docs/en/Deployment-React-Publish-IIS.md @@ -41,7 +41,7 @@ The React application is built using Vite and can be deployed as static files to VITE_API_BASE_URL=https://your-host-api-url ``` -2. Run `yarn build` or `npm run build`. This command outputs the production build to the `dist` folder. +2. Run `pnpm build` or `npm run build`. This command outputs the production build to the `dist` folder. 3. Copy all files from the `dist` folder to your IIS website directory (for example: `C:\inetpub\wwwroot\reactwebsite`). diff --git a/docs/en/Deployment-React.md b/docs/en/Deployment-React.md index c8feeae2..28ead18f 100644 --- a/docs/en/Deployment-React.md +++ b/docs/en/Deployment-React.md @@ -8,8 +8,8 @@ ASP.NET Zero React UI is built using [Vite](https://vite.dev/) as the build tool To build the React application for production, run the following commands in the root directory of the React project: -1. Run `yarn` or `npm install` to install dependencies. -2. Run `yarn build` or `npm run build` to create a production build. +1. Run `pnpm install` or `npm install` to install dependencies. +2. Run `pnpm build` or `npm run build` to create a production build. The build output will be placed in the `dist/` folder, ready for deployment to any static file server. @@ -29,7 +29,7 @@ ASP.NET Zero also provides a merged solution where the React client-side applica To publish the merged solution: -1. Run `yarn build` or `npm run build` in the React project to build the client application. +1. Run `pnpm build` or `npm run build` in the React project to build the client application. 2. Run `dotnet publish -c Release` in the root directory of the `*.Host` project. See the [dotnet publish documentation](https://docs.microsoft.com/en-us/dotnet/core/tools/dotnet-publish) for additional parameters. 3. When the publish is complete, ensure the React build output is copied to the `wwwroot` folder of the published Host application. @@ -47,7 +47,7 @@ Vite automatically applies the following optimizations for production builds: You can preview the production build locally by running: ```bash -yarn preview +pnpm preview # or npm run preview ``` diff --git a/docs/en/Development-React-Docker.md b/docs/en/Development-React-Docker.md index 946bd0bc..2ed668d1 100644 --- a/docs/en/Development-React-Docker.md +++ b/docs/en/Development-React-Docker.md @@ -56,7 +56,7 @@ The React UI is a client-side application that can be run in two ways during dev Run the React UI using the Vite development server: ```bash -yarn && yarn dev +pnpm install && pnpm dev # or npm install && npm run dev ``` diff --git a/docs/en/Getting-Started-Angular-Merged.md b/docs/en/Getting-Started-Angular-Merged.md index c3c4bd99..0bc0bf3b 100644 --- a/docs/en/Getting-Started-Angular-Merged.md +++ b/docs/en/Getting-Started-Angular-Merged.md @@ -18,7 +18,7 @@ Select **ASP.NET Core & Angular** as Project Type and fill other required fields - [Visual Studio 2017 (v15.9.0+)](https://www.visualstudio.com) (for backend ASP.NET Core application) - [Node.js 6.9+ with NPM 3.10+](https://nodejs.org/en/download/) -- [Yarn v1.x](https://classic.yarnpkg.com/lang/en/) +- [pnpm](https://pnpm.io/installation) ## ASP.NET Core Application @@ -89,16 +89,16 @@ For example when you navigate **Swagger UI**, you will see following page: Navigate to the root folder of ***.Web.Host** project, open a command line and run the following command to restore the packages: ```bash -yarn +pnpm install ``` Then, run the following command to create dynamic bundles *(This is only required for the first time when you download the project or when you update dynamic bundles)*: ```bash -npm run create-dynamic-bundles +pnpm run create-dynamic-bundles ``` -We use [yarn v1.x](https://classic.yarnpkg.com/lang/en/) because NPM has some problems; It is slow and can not consistently resolve dependencies. Yarn solves those problems and it is compatible to NPM as well. +We use [pnpm](https://pnpm.io/) for fast, disk-efficient and deterministic dependency resolution. The pinned version is declared in `package.json` under the `packageManager` field, so [Corepack](https://nodejs.org/api/corepack.html) will activate the correct pnpm version automatically. ### Running The Application diff --git a/docs/en/Getting-Started-Angular.md b/docs/en/Getting-Started-Angular.md index 5af5f309..4c16728e 100644 --- a/docs/en/Getting-Started-Angular.md +++ b/docs/en/Getting-Started-Angular.md @@ -26,7 +26,7 @@ If you have selected this option, please follow [Getting Started](Getting-Starte - [Visual Studio 2017 (v15.9.0+)](https://www.visualstudio.com) (for backend ASP.NET Core application) - [Node.js 16.x+ with NPM 8.x+](https://nodejs.org/en/download/) -- [Yarn v1.x](https://classic.yarnpkg.com/lang/en/) +- [pnpm](https://pnpm.io/installation) ## ASP.NET Core Application @@ -97,16 +97,16 @@ For example when you navigate **Swagger UI**, you will see following page: Navigate to the **angular** folder, open a command line and run the following command to restore the packages: ```bash -yarn +pnpm install ``` Then, run the following command to create dynamic bundles *(This is only required for the first time when you download the project or when you update dynamic bundles)*: ```bash -npm run create-dynamic-bundles +pnpm run create-dynamic-bundles ``` -We use [yarn v1.x](https://classic.yarnpkg.com/lang/en/) because NPM has some problems; It is slow and can not consistently resolve dependencies. Yarn solves those problems and it is compatible to NPM as well. +We use [pnpm](https://pnpm.io/) for fast, disk-efficient and deterministic dependency resolution. The pinned version is declared in `package.json` under the `packageManager` field, so [Corepack](https://nodejs.org/api/corepack.html) will activate the correct pnpm version automatically. ### Running The Application diff --git a/docs/en/Getting-Started-Core.md b/docs/en/Getting-Started-Core.md index d39fb438..eb509795 100644 --- a/docs/en/Getting-Started-Core.md +++ b/docs/en/Getting-Started-Core.md @@ -14,17 +14,17 @@ Select **ASP.NET Core & jQuery** as Project Type and fill other required fields. - [Visual Studio 2017 (v15.9.0+)](https://www.visualstudio.com) - [Node.js 16.x+ with NPM 8.x+](https://nodejs.org/en/download/) -- [Yarn v1.x](https://classic.yarnpkg.com/lang/en/) +- [pnpm](https://pnpm.io/installation) ## Configure The Project -Before opening the solution, open a command prompt, navigate to root directory of **\*.Web.Mvc** project and run "**yarn**" command to install client side dependencies. +Before opening the solution, open a command prompt, navigate to root directory of **\*.Web.Mvc** project and run "**pnpm install**" command to install client side dependencies. ```bash -yarn +pnpm install ``` -**Important Notice:** Installing client side npm dependencies using **yarn** before opening the solution will decrease project opening & building time dramatically. +**Important Notice:** Installing client side npm dependencies using **pnpm** before opening the solution will decrease project opening & building time dramatically. Open the **\*.Web.sln** solution in **Visual Studio**. If you want to work on only MAUI project, open **\*.Maui.sln** solution. If you want to work on both MAUI and Web projects, open **\*.All.sln** solution. diff --git a/docs/en/Getting-Started-MacOSX.md b/docs/en/Getting-Started-MacOSX.md index b68b6892..6ab9354e 100644 --- a/docs/en/Getting-Started-MacOSX.md +++ b/docs/en/Getting-Started-MacOSX.md @@ -7,16 +7,16 @@ Download an ASP.NET CORE & Angular project with .NET Core framework as described - Visual Studio for Mac: [https://visualstudio.microsoft.com/vs/mac/](https://visualstudio.microsoft.com/vs/mac/) - .Net core SDK: [https://www.microsoft.com/net/download/macos](https://www.microsoft.com/net/download/macos) - - Yarn v1.x [https://classic.yarnpkg.com/en/docs/install#mac-stable](https://classic.yarnpkg.com/en/docs/install#mac-stable) + - pnpm [https://pnpm.io/installation#using-a-standalone-script](https://pnpm.io/installation#using-a-standalone-script) - NVM with node version 8.11.1+: [https://github.com/creationix/nvm](https://github.com/creationix/nvm) - Angular-cli ([https://cli.angular.io/](https://cli.angular.io/)) ## Restoring Packages -In the terminal, go to base_folder/angular and run the `yarn` command: +In the terminal, go to base_folder/angular and run the `pnpm install` command: ```bash -yarn +pnpm install ``` ## Configuration & Build diff --git a/docs/en/Getting-Started-React.md b/docs/en/Getting-Started-React.md index b414ea70..974a21a1 100644 --- a/docs/en/Getting-Started-React.md +++ b/docs/en/Getting-Started-React.md @@ -20,7 +20,7 @@ Select **ASP.NET Core & React** as Project Type and fill other required fields. - [Visual Studio 2022 (v17.10+)](https://www.visualstudio.com) (for backend ASP.NET Core application) - [Node.js 18.x+ with NPM 8.x+](https://nodejs.org/en/download/) -- [Yarn v1.x](https://classic.yarnpkg.com/lang/en/) +- [pnpm](https://pnpm.io/installation) ## ASP.NET Core Application @@ -88,24 +88,20 @@ For example when you navigate **Swagger UI**, you will see following page: ### Restore Packages -Navigate to the **react** folder, open a command line and run one of the following commands to restore the packages: +Navigate to the **react** folder, open a command line and run the following command to restore the packages: ```bash -yarn -# or -npm install +pnpm install ``` -We recommend using [yarn v1.x](https://classic.yarnpkg.com/lang/en/) for faster and more consistent dependency resolution, but npm works as well. +We use [pnpm](https://pnpm.io/) for faster and more deterministic dependency resolution. The pinned version is declared in `package.json` under the `packageManager` field, so [Corepack](https://nodejs.org/api/corepack.html) will activate the correct pnpm version automatically. NPM also works if you prefer it (`npm install`). ### Running The Application -Run one of the following commands in the command line: +Run the following command in the command line: ```bash -yarn dev -# or -npm run dev +pnpm dev ``` Once the application compiled, you can browse in your browser. diff --git a/docs/en/Infrastructure-Angular-Npm-Packages.md b/docs/en/Infrastructure-Angular-Npm-Packages.md index 773645a3..d7261514 100644 --- a/docs/en/Infrastructure-Angular-Npm-Packages.md +++ b/docs/en/Infrastructure-Angular-Npm-Packages.md @@ -1,3 +1,3 @@ # NPM Packages -ASP.NET Zero solution supports both [Yarn v1.x](https://classic.yarnpkg.com/lang/en/) and [NPM](https://www.npmjs.com/) to obtain front end library dependencies (like Angular and Bootstrap). We suggest to use yarn because NPM has some problems, yarn solves those problems and it is compatible with NPM as well. You can easily add, update or remove packages on yarn's command line interface. \ No newline at end of file +ASP.NET Zero solution uses [pnpm](https://pnpm.io/) (preferred) to obtain front end library dependencies (like Angular and Bootstrap). [NPM](https://www.npmjs.com/) is also supported. We suggest using pnpm because it is fast, disk-efficient, and deterministic. The pinned pnpm version is declared in `package.json` under the `packageManager` field, so [Corepack](https://nodejs.org/api/corepack.html) will activate the correct version automatically. You can easily add, update or remove packages on pnpm's command line interface. \ No newline at end of file diff --git a/docs/en/Infrastructure-React-Bundling-Minifying-Compiling.md b/docs/en/Infrastructure-React-Bundling-Minifying-Compiling.md index 724e1d55..265a22af 100644 --- a/docs/en/Infrastructure-React-Bundling-Minifying-Compiling.md +++ b/docs/en/Infrastructure-React-Bundling-Minifying-Compiling.md @@ -7,7 +7,7 @@ ASP.NET Zero uses [Vite](https://vitejs.dev/) to build the React application. Vi During development, run the following command to start the Vite development server: ```bash -yarn dev +pnpm dev # or npm run dev ``` @@ -19,7 +19,7 @@ Vite provides fast Hot Module Replacement (HMR) and serves your assets without b For production, run the following command: ```bash -yarn build +pnpm build # or npm run build ``` @@ -37,7 +37,7 @@ This command will: To preview the production build locally before deployment, you can use: ```bash -yarn preview +pnpm preview # or npm run preview ``` diff --git a/docs/en/Infrastructure-React-Npm-Packages.md b/docs/en/Infrastructure-React-Npm-Packages.md index f018fabd..b1df191e 100644 --- a/docs/en/Infrastructure-React-Npm-Packages.md +++ b/docs/en/Infrastructure-React-Npm-Packages.md @@ -1,17 +1,17 @@ # Package Management -ASP.NET Zero React UI uses [Yarn](https://classic.yarnpkg.com/) or [NPM](https://www.npmjs.com/) to manage front-end library dependencies (like React and Ant Design). You can easily add, update, or remove packages using the command line interface. +ASP.NET Zero React UI uses [pnpm](https://pnpm.io/) (preferred) or [NPM](https://www.npmjs.com/) to manage front-end library dependencies (like React and Ant Design). The pinned pnpm version is declared in `package.json` under the `packageManager` field, so [Corepack](https://nodejs.org/api/corepack.html) will activate the correct version automatically. You can easily add, update, or remove packages using the command line interface. ## Common Commands -| Action | Yarn | NPM | +| Action | pnpm | NPM | |--------|------|-----| -| Install all dependencies | `yarn` | `npm install` | -| Add a new package | `yarn add package-name` | `npm install package-name` | -| Add a dev dependency | `yarn add package-name --dev` | `npm install package-name --save-dev` | -| Update packages | `yarn upgrade` | `npm update` | -| Remove a package | `yarn remove package-name` | `npm uninstall package-name` | +| Install all dependencies | `pnpm install` | `npm install` | +| Add a new package | `pnpm add package-name` | `npm install package-name` | +| Add a dev dependency | `pnpm add -D package-name` | `npm install package-name --save-dev` | +| Update packages | `pnpm update` | `npm update` | +| Remove a package | `pnpm remove package-name` | `npm uninstall package-name` | ## Package.json -Dependencies are defined in [package.json](../package.json). After modifying dependencies, run `yarn` or `npm install` to update your `node_modules` folder. +Dependencies are defined in [package.json](../package.json). After modifying dependencies, run `pnpm install` or `npm install` to update your `node_modules` folder. diff --git a/docs/en/Infrastructure-React-Vite.md b/docs/en/Infrastructure-React-Vite.md index 6244ce3b..ce56890a 100644 --- a/docs/en/Infrastructure-React-Vite.md +++ b/docs/en/Infrastructure-React-Vite.md @@ -7,7 +7,7 @@ ASP.NET Zero React UI uses [Vite](https://vitejs.dev/) for development and produ To run the application in development mode, open a terminal and run: ```bash -yarn dev +pnpm dev # or npm run dev ``` @@ -19,7 +19,7 @@ Once compiled and ready, you can open the application in your browser at **Note:** The ASP.NET Zero MVC project now uses [pnpm](https://pnpm.io/) (pinned via the `packageManager` field in `package.json`) instead of Yarn. The simplest approach on Azure Pipelines is a **Command Line** task that enables Corepack and runs `pnpm install`, since Corepack ships with Node.js 16.10+ and activates the pinned pnpm version automatically. +1. #### **Execute pnpm install Task** -Click on the **Get it free** button to install the necessary extension for your organization. - -![Add new task](images/azure-pipelines-add-marketplace-yarn.png) - -1. #### **Execute Yarn Task** - - For the MVC project, we have to run `yarn` command in the `src/MyPortalDemo.Web.Mvc` folder. To do this click the `Show asisstant` icon on top of the task list. + For the MVC project, we have to run `pnpm install` in the `src/MyPortalDemo.Web.Mvc` folder. To do this click the `Show assistant` icon on top of the task list. ![Add new task](images/azure-pipelines-show-assistant.png) - Write **yarn** into the search textbox and click on the **Yarn task** to install this new Yarn task. + In the Tasks panel, search for **Command Line** and select the **Command line** task. Place it right after the **Build** step. - ![Install yarn](images/azure-pipelines-add-yarn-task.png) + ![Add Command Line task for pnpm](images/azure-pipelines-add-pnpm-task.png) + Use the following script and set the **Working Directory** (under **Advanced**) to `src/MyPortalDemo.Web.Mvc`: + + ```bash + corepack enable + pnpm install --frozen-lockfile + ``` - After adding it, the new Yarn task is placed at the end. Move it after the **Build** step. Then, enter `src/MyPortalDemo.Web.Mvc` in the Project Directory. This step is completed. + ![Configure pnpm install task](images/azure-pipelines-add-pnpm-task-2.png) - ![Yarn task](images/azure-pipelines-add-yarn-task2.png) + This installs the pnpm version pinned in `package.json` and restores client-side dependencies. This step is completed. @@ -167,24 +168,24 @@ Click on the **Get it free** button to install the necessary extension for your -2. #### **NPM Run Build Task** +2. #### **pnpm run build Task** - To add NPM Run Build task, write `command line` to the search textbox. Click the **Add** button of **Command Line** item. + To add the production build task, write `command line` to the search textbox. Click the **Add** button of **Command Line** item. ![Add command line task](images/azure-pipelines-add-npm-run-build-task.png) - It will append it after right after the **Yarn** task. If it comes to the end, you need to move it after **Yarn** task. + It will append it right after the **pnpm install** task. If it comes to the end, you need to move it after the **pnpm install** task. + Use the following script and set the **Working Directory** (under **Advanced**) to `src/MyPortalDemo.Web.Mvc`: ```bash - cd src/MyPortalDemo.Web.Mvc - npm run build + pnpm run build ``` - ![NPM Run Build Task](images/azure-pipelines-add-npm-run-build-task2.png) + ![pnpm run build Task](images/azure-pipelines-add-pnpm-task-3.png) @@ -216,7 +217,7 @@ After clicking the **Save** button on the toolbar, press the **Run** button. The -So far, we have created a pipeline to get our project from GitHub, build, yarn, NPM run build, test and publish. The next step is copying the publish output to Azure App Service. +So far, we have created a pipeline to get our project from GitHub, build, pnpm install, pnpm run build, test and publish. The next step is copying the publish output to Azure App Service. **Before starting this step, we assume that you have already created a web app on Azure App Services and set up your database**. diff --git a/docs/en/images/azure-pipelines-add-pnpm-task-2.png b/docs/en/images/azure-pipelines-add-pnpm-task-2.png new file mode 100644 index 00000000..f199376c Binary files /dev/null and b/docs/en/images/azure-pipelines-add-pnpm-task-2.png differ diff --git a/docs/en/images/azure-pipelines-add-pnpm-task-3.png b/docs/en/images/azure-pipelines-add-pnpm-task-3.png new file mode 100644 index 00000000..7c85080d Binary files /dev/null and b/docs/en/images/azure-pipelines-add-pnpm-task-3.png differ diff --git a/docs/en/images/azure-pipelines-add-pnpm-task.png b/docs/en/images/azure-pipelines-add-pnpm-task.png new file mode 100644 index 00000000..233ebced Binary files /dev/null and b/docs/en/images/azure-pipelines-add-pnpm-task.png differ