Error installing npm package on Azure app service deploy

Question

I'm trying to deploy my reactjs project on Azure app service but when I started the deploy I get the follow log error on npm install part and the deploy failed

My node version is 16.13.2

I followed these steps:

1- Run npm run build

2- Deploy to the main branch

3- Deploy started automaticaly to Azure app service

4- Got the Erro:

Updating iisnode.yml at C:\home\site\wwwroot\iisnode.yml
Invalid start-up command "react-scripts start" in package.json. Please use the format "node <script relative path>".
Missing server.js/app.js files, web.config is not generated
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated [email protected]: This SVGO version is no longer supported. Upgrade to v2.x.x.
npm ERR! code 8
npm ERR! path C:\home\site\wwwroot\node_modules\@progress\kendo-licensing
npm ERR! command failed
npm ERR! command C:\Windows\system32\cmd.exe /d /s /c node ./bin/kendo-ui-license.js activate --ignore-no-license
npm ERR! C:\home\site\wwwroot\node_modules\@progress\kendo-licensing\bin\kendo-ui-license.js:2
npm ERR! amespace[_0x4d18('0x4c')](licenseFile,fs__namespace[_0x4d18('0x11')][_0x4d18('
npm ERR!                                                                     ^
npm ERR! TypeError: Cannot read property 'R_OK' of undefined
npm ERR!     at activateLicense (C:\home\site\wwwroot\node_modules\@progress\kendo-licensing\bin\kendo-ui-license.js:2:8834)
npm ERR!     at Object.<anonymous> (C:\home\site\wwwroot\node_modules\@progress\kendo-licensing\bin\kendo-ui-license.js:2:7890)
npm ERR!     at Module._compile (module.js:456:26)
npm ERR!     at Object.Module._extensions..js (module.js:474:10)
npm ERR!     at Module.load (module.js:356:32)
npm ERR!     at Function.Module._load (module.js:312:12)
npm ERR!     at Function.Module.runMain (module.js:497:10)
Failed exitCode=8, command="C:\Program Files (x86)\nodejs\16.13.0\node.exe" "C:\Program Files (x86)\npm\8.1.0\node_modules\npm\bin\npm-cli.js" install --production
npm ERR!     at startup (node.js:119:16)
An error has occurred during web site deployment.
npm ERR!     at node.js:935:3

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\local\LocalAppData\npm-cache\_logs\2022-03-05T13_14_13_352Z-debug.log
Invalid start-up command "react-scripts start" in package.json. Please use the format "node <script relative path>".\r\nMissing server.js/app.js files, web.config is not generated\r\nnpm WARN deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated\r\nnpm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated\r\nnpm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated\r\nnpm WARN deprecated [email protected]: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies\r\nnpm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated\r\nnpm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated\r\nnpm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.\r\nnpm WARN deprecated [email protected]: This SVGO version is no longer supported. Upgrade to v2.x.x.\r\nnpm ERR! code 8\r\nnpm ERR! path C:\home\site\wwwroot\node_modules\@progress\kendo-licensing\r\nnpm ERR! command failed\r\nnpm ERR! command C:\Windows\system32\cmd.exe /d /s /c node ./bin/kendo-ui-license.js activate --ignore-no-license\r\nnpm ERR! C:\home\site\wwwroot\node_modules\@progress\kendo-licensing\bin\kendo-ui-license.js:2\r\nnpm ERR! amespace[_0x4d18('0x4c')](licenseFile,fs__namespace[_0x4d18('0x11')][_0x4d18('\r\nnpm ERR!                                                                     ^\r\nnpm ERR! TypeError: Cannot read property 'R_OK' of undefined\r\nnpm ERR!     at activateLicense (C:\home\site\wwwroot\node_modules\@progress\kendo-licensing\bin\kendo-ui-license.js:2:8834)\r\nnpm ERR!     at Object.<anonymous> (C:\home\site\wwwroot\node_modules\@progress\kendo-licensing\bin\kendo-ui-license.js:2:7890)\r\nnpm ERR!     at Module._compile (module.js:456:26)\r\nnpm ERR!     at Object.Module._extensions..js (module.js:474:10)\r\nnpm ERR!     at Module.load (module.js:356:32)\r\nnpm ERR!     at Function.Module._load (module.js:312:12)\r\nnpm ERR!     at Function.Module.runMain (module.js:497:10)\r\nnpm ERR!     at startup (node.js:119:16)\r\nnpm ERR!     at node.js:935:3\r\n\r\nnpm ERR! A complete log of this run can be found in:\r\nnpm ERR!     C:\local\LocalAppData\npm-cache\_logs\2022-03-05T13_14_13_352Z-debug.log\r\nC:\Program Files (x86)\SiteExtensions\Kudu\96.40113.5578\bin\Scripts\starter.cmd "C:\home\site\deployments\tools\deploy.cmd"

Here is my package.json:

{
  "name": "",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@progress/kendo-data-query": "^1.5.5",
    "@progress/kendo-drawing": "^1.16.2",
    "@progress/kendo-licensing": "^1.2.2",
    "@progress/kendo-react-animation": "^5.0.1",
    "@progress/kendo-react-data-tools": "^5.0.1",
    "@progress/kendo-react-dateinputs": "^5.0.1",
    "@progress/kendo-react-dropdowns": "^5.0.1",
    "@progress/kendo-react-grid": "^5.0.1",
    "@progress/kendo-react-inputs": "^5.0.1",
    "@progress/kendo-react-intl": "^5.0.1",
    "@progress/kendo-react-treeview": "^5.0.1",
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^12.0.0",
    "@testing-library/user-event": "^13.2.1",
    "@types/jest": "^27.0.1",
    "@types/node": "^16.7.13",
    "@types/react-dom": "^17.0.9",
    "axios": "^0.25.0",
    "miragejs": "^0.1.43",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-icons": "^4.3.1",
    "react-input-mask": "^2.0.4",
    "react-router-dom": "^6.2.1",
    "react-scripts": "5.0.0",
    "styled-components": "^5.3.3",
    "typescript": "^4.4.2",
    "web-vitals": "^2.1.0",
    "webpack-cli": "3.1.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@types/react": "^17.0.39",
    "@types/styled-components": "^5.1.19",
    "@types/uuid": "^8.3.4"
  },
  "engines": {
    "node": ">8.0.0"
  }
}

Answer 1

As the error stating that, web.config file is not generated.

So, Create web.config file if you don't have and Put it in /public.

During the build, it is copied over to dist folder.

Here is workaround I tried to create the web.config file.

Web.config file is copied to dist folder after running npm run build command.

After publishing, check in the Azure Portal > Web App > Advanced Tools > Kudu - Debug Console (CMD) > Site - wwwroot, check if web.config file exists.