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.

As you can see in https://github.com/orgs/community/discussions/categories/pages title bar :

Conversations related to GitHub Pages, a static site hosting service that takes HTML, CSS, and JavaScript files straight from a repository on GitHub and publishes a website.

So You Can not add packages in Github Pages by add package or something like this .

but i use some ways to add packages and use it in Pages .
you can easily Link CDN link of your package you need in HTML . then you can see your View Deployment Page will work carefully .

As a example . if you installed Bootstrap V5.1 npm package in your files . you can easily use this link to find Bootstrap V5.1 cnd link . and link it in your HTML link :
https://cdnjs.com/libraries/bootstrap/5.0.1

I hope it is helpful for you !