Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Trying to deploy my React app with gh-pages but got this error message : The "file" argument must be of type string. Received type undefined

I was trying to deploy my React app with gh-pages but I'm facing this error : The "file" argument must be of type string. Received type undefined.

At first, I thought it was my code so I've made another create-react-app with no modification, trying to deploy with npm run deploy command but got this error message again.

My package.json (I've added my homepage link, the predeploy and deploy scripts, and the gh-pages dependency) :

  "name": "test-deploy",
  "version": "0.1.0",
  "private": true,
  "homepage": "https://vnsteven.github.io/test-deploy/",
  "dependencies": {
    "gh-pages": "^2.1.0",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "3.0.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Error output:

> npm run build


> [email protected] build /Users/vansteven/Desktop/test-deploy
> react-scripts build

Creating an optimized production build...
Compiled successfully.

File sizes after gzip:

  36.44 KB  build/static/js/2.b41502e9.chunk.js
  770 B     build/static/js/runtime~main.90bc13d1.js
  601 B     build/static/js/main.74c1ab4e.chunk.js
  517 B     build/static/css/main.2cce8147.chunk.css

The project was built assuming it is hosted at /test-deploy/.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.
To publish it at https://vnsteven.github.io/test-deploy/ , run:

  yarn run deploy

> [email protected] deploy /Users/vansteven/Desktop/test-deploy
> gh-pages -d build

The "file" argument must be of type string. Received type undefined
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] deploy: `gh-pages -d build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] deploy script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/vansteven/.npm/_logs/2019-08-01T17_48_50_611Z-debug.log

le shell a retourné 1

Logs:

1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'deploy' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'predeploy', 'deploy', 'postdeploy' ]
5 info lifecycle [email protected]~predeploy: [email protected]
6 verbose lifecycle [email protected]~predeploy: unsafe-perm in lifecycle true
7 verbose lifecycle [email protected]~predeploy: PATH: /usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/Users/vansteven/Desktop/test-deploy/node_modules/.bin:/Users/vansteven/.rvm/gems/ruby-2.5.1/bin:/Users/vansteven/.rvm/gems/ruby-2.5.1@global/bin:/Users/vansteven/.rvm/rubies/ruby-2.5.1/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Users/vansteven/.rvm/bin
8 verbose lifecycle [email protected]~predeploy: CWD: /Users/vansteven/Desktop/test-deploy
9 silly lifecycle [email protected]~predeploy: Args: [ '-c', 'npm run build' ]
10 silly lifecycle [email protected]~predeploy: Returned: code: 0  signal: null
11 info lifecycle [email protected]~deploy: [email protected]
12 verbose lifecycle [email protected]~deploy: unsafe-perm in lifecycle true
13 verbose lifecycle [email protected]~deploy: PATH: /usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/Users/vansteven/Desktop/test-deploy/node_modules/.bin:/Users/vansteven/.rvm/gems/ruby-2.5.1/bin:/Users/vansteven/.rvm/gems/ruby-2.5.1@global/bin:/Users/vansteven/.rvm/rubies/ruby-2.5.1/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Users/vansteven/.rvm/bin
14 verbose lifecycle [email protected]~deploy: CWD: /Users/vansteven/Desktop/test-deploy
15 silly lifecycle [email protected]~deploy: Args: [ '-c', 'gh-pages -d build' ]
16 silly lifecycle [email protected]~deploy: Returned: code: 1  signal: null
17 info lifecycle [email protected]~deploy: Failed to exec deploy script
18 verbose stack Error: [email protected] deploy: `gh-pages -d build`
18 verbose stack Exit status 1
18 verbose stack     at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:301:16)
18 verbose stack     at EventEmitter.emit (events.js:198:13)
18 verbose stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
18 verbose stack     at ChildProcess.emit (events.js:198:13)
18 verbose stack     at maybeClose (internal/child_process.js:982:16)
18 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:259:5)
19 verbose pkgid [email protected]
20 verbose cwd /Users/vansteven/Desktop/test-deploy
21 verbose Darwin 16.7.0
22 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "deploy"
23 verbose node v10.16.0
24 verbose npm  v6.9.0
25 error code ELIFECYCLE
26 error errno 1
27 error [email protected] deploy: `gh-pages -d build`
27 error Exit status 1
28 error Failed at the [email protected] deploy script.
28 error This is probably not a problem with npm. There is likely additional logging output above.
29 verbose exit [ 1, true ]

This error message comes from my brand new React application. Only my package.json has been modified.

like image 446
Steven N Avatar asked Aug 01 '19 18:08

Steven N


People also ask

Can we deploy React app on GitHub Pages?

The simplicity of deploying a static website with GitHub Pages is a process that can be easily transferred to React applications. With just a few steps, it's easy to host a React app on GitHub Pages for free or build it to deploy on your own custom domain or subdomain.

How to use GH-pages with ReactJS?

To allow us to use the gh-pages package properly, we need to add two keys to our scripts value in the package.json file: Next, we need to modify our package.json file by adding the homepage field. This field is used by React to figure out the root URL in the built HTML file. In it, we will put the URL of our GitHub repository.

How to deploy your code to GitHub Pages using GH-pages?

This package will help us to deploy our code to the gh-pages branch which will be used to host our application on GitHub Pages. To allow us to use the gh-pages package properly, we need to add two keys to our scripts value in the package.json file: Next, we need to modify our package.json file by adding the homepage field.

How do I add a GitHub page to a React project?

Head over to your GitHub account and create a repository with the same name as the React project. ☝️ Make sure to mark your repository as public. If you mark it as private, you won't be able to use GitHub Pages. We are going to add this repository as a remote to our project.

How do I deploy my application to GitHub Pages?

To deploy our application, type the following in the terminal: Running the command above takes care of building your application and pushing it to a branch called gh-pages, which GitHub uses to link with GitHub Pages.


2 Answers

Seems like a bug in gh-pages 2.1.

I solved mine by downgrading gh-pages to version 2.0:

yarn add [email protected] -D` // or

npm install -D [email protected]
like image 165
Rem Lampa Avatar answered Oct 26 '22 23:10

Rem Lampa


Update: Fixed in [email protected]. You can now update your gh-pages package to latest version to fix this.

npm i gh-pages@latest

If you don't wish to downgrade to version 2.0.1, the workaround is to instead of using "deploy": "gh-pages -d build" as your deploy script, use:

"deploy": "gh-pages -d build --git git"

This somehow fixes the problem.

You can find the GitHub issue about this bug here: tschaub/gh-pages#308

like image 37
Vaibhav Vishal Avatar answered Oct 27 '22 01:10

Vaibhav Vishal