无法将 create-react-app 部署到 github-pages

Question

I'm trying to deploy a react app using gh-pages, the build is generated successfully but at the moment of deployment I get this error:

> reactapp@0.1.0 deploy C:\Users\javier\Desktop\Code\React1.0\1.1\CV19\reactapp
> gh-pages -d build

warning: failed to remove node_modules/jest-environment-jsdom-fourteen/node_modules/jsdom/lib/jsdom/living/constraint-validation/DefaultConstraintValidation-impl.js: Filename too long

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR!reactapp@0.1.0 deploy: `gh-pages -d build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the reactapp@0.1.0 deploy script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

My package.json:

  {
  "homepage ": "http://javier.github.io/reactapp",
  "name": "reactapp",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@material-ui/core": "^4.11.0",
    "@material-ui/icons": "^4.9.1",
    "@reduxjs/toolkit": "^1.4.0",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "axios": "^0.21.0",
    "gh-pages": "^2.0.1",
    "mapbox-gl": "^1.12.0",
    "react": "^16.13.1",
    "react-bootstrap-icons": "^1.0.0",
    "react-dom": "^16.13.1",
    "react-map-gl": "^5.2.8",
    "react-mapbox-gl": "^5.0.0",
    "react-redux": "^7.2.1",
    "react-router-dom": "^5.2.0",
    "react-scripts": "^4.0.0",
    "redux": "^4.0.5"
  },
  "scripts": {
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build",
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

Anyone knows what could cause this error?

Answer 1

This is caused by Windows itself.

Under the Windows file naming system the total name or path cannot exceed 259 characters. This includes the folder path, file name and file extension. If it does, then when you try to delete or move it, you will receive this error.

I've fixed this issue by renaming the folder(s) or file(s) affected. In your case the file is located in the node_modules folder which makes it a bit harder to deal with.

I would suggest moving the app to a top level folder - not in a nested folder on your desktop.

Edit: there is a similar question on the Microsoft's help forum which might be helpful.