Search code examples
githubnpmgithub-pagespackage.json

How to deploy npm project to gh-pages


I'm trying to deploy a website to gh-pages using npm. I'm using blain HTML and CSS and asynchronous javascript. I haven't used any SPA framework (react or angular). I'm currently using lite server for development purposes and gh-pages package.

I'm trying to deploy the src folder using the following command npm run deploy

it fails because the build script is not specified. my question is what should I write in the build script?

when I try to run npm run deploy it displays the following error


'src' is not recognized as an internal or external command,
operable program or batch file.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `src`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build 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!     C:\Users\Amr\AppData\Roaming\npm-cache\_logs\2020-05-30T11_30_29_824Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] predeploy: `npm run build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] predeploy 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!     C:\Users\Amr\AppData\Roaming\npm-cache\_logs\2020-05-30T11_30_29_869Z-debug.log

in similar projects using react, the build script has the following react-scripts build

this is my package.json file

{
    "name": "AmrAhmed",
    "version": "1.0.0",
    "description": "",
    "main": "truffle.js",
    "directories": {
        "test": "test"
    },
    "scripts": {
        "dev": "lite-server",
        "test": "echo \"Error: no test specified\" && exit 1",
        "build": "src",
        "predeploy": "npm run build",
        "deploy": "gh-pages -d src"
    },
    "author": "",
    "license": "ISC",
    "devDependencies": {
        "gh-pages": "^3.0.0",
        "lite-server": "^2.5.4"
    }
}

election folder content

src folder content


Solution

  • I found out that you don't need the build script or the pre-deploy script. they are unnecessary to be used, since my website is static, I can navigate directly to the build folder and it will work fine.

    I have modified the config.json file to be as in the following

    {
        "name": "AmrAhmed",
        "version": "1.0.0",
        "description": "",
        "main": "truffle.js",
        "directories": {
            "test": "test"
        },
        "scripts": {
            "dev": "lite-server",
            "test": "echo \"Error: no test specified\" && exit 1",
            "deploy": "gh-pages -d src"
        },
        "author": "",
        "license": "ISC",
        "devDependencies": {
            "gh-pages": "^3.0.0",
            "lite-server": "^2.5.4"
        }
    }
    

    run the command npm run build

    and it will be deployed to Github pages.