How to deploy npm project to gh-pages - github

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! AmrAhmed#1.0.0 build: `src`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the AmrAhmed#1.0.0 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! AmrAhmed#1.0.0 predeploy: `npm run build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the AmrAhmed#1.0.0 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

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.

you should also add "homepage":"https://yourGithub.github.io/your-repo" above "name" in the package.json

Related

how to solve this issue connection_string.ts in nodeModule and run npm install?

I am trying to run npm install so I can do yarn start to deploy the project to AWS but it gives me an error. Anyone here can help me understand what is going on and how to solve it?
this is image for problems I have to this issue:
https://drive.google.com/file/d/1sgxCvaVa-mR7HBb3G8o1PU8pi3dydjS3/view?usp=sharing
The Error output here:
npm ERR! code ENOENT
npm ERR! syscall open
npm ERR! path /Users/youmnasalloum/.npm/_cacache/tmp/git-cloneG2Tj0m/package.json
npm ERR! errno -2
npm ERR! enoent ENOENT: no such file or directory, open '/Users/youmnasalloum/.npm/_cacache/tmp/git-cloneG2Tj0m/package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/youmnasalloum/.npm/_logs/2022-04-04T10_05_54_917Z-debug-0.log
The package.json content here:
{
"name": "user",
"version": "1.0.0",
"main": "index.ts",
"repository": "https://github.com/ArtistCrowdfundExchange/user",
"author": "Oghogho Odemwingie",
"license": "MIT",
"devDependencies": {
"#types/bcrypt": "^3.0.0",
"#types/node": "^17.0.13",
"typescript": "4.5.5"
},
"scripts": {
"start": "ts-node index.ts",
"test": "echo no tests yet"
},
"dependencies": {
"#aws-sdk/client-s3": "^3.41.0",
"#grpc/grpc-js": "^1.3.7",
"aws4": "^1.11.0",
"bcrypt": "^5.0.0",
"cuid": "^2.1.8",
"jose": "3",
"mongodb": "^4.4.1",
"mongodb-connection-string-url": "^2.5.2",
"mongojs": "^3.1.0",
"mongoose": "6.1.8",
"nanoid": "^3.1.29",
"next-auth": "^4.3.1",
"proto": "git+https://github.com/ArtistCrowdfundExchange/proto#playground",
"ts-node": "^10.4.0",
"winston": "^3.3.3"
}
}

Npm failure for the ionic project creation

ionic start my-app tabs --capacitor
Pick a framework!
Please select the JavaScript framework to use for your new app. To bypass this prompt next time, supply a value for the
--type option.
? Framework: React
√ Preparing directory .\my-app in 2.24ms
√ Downloading and extracting tabs starter in 325.63ms
ionic integrations enable capacitor --quiet -- my-app io.ionic.starter
npm.cmd i --save -E #capacitor/core
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: ionic-app-base#0.1.0
npm ERR! Found: typescript#4.1.3
npm ERR! node_modules/typescript
npm ERR! typescript#"4.1.3" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peerOptional typescript#"^3.2.1" from react-scripts#4.0.1
npm ERR! node_modules/react-scripts
npm ERR! react-scripts#"4.0.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\sowmyans\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\sowmyans\AppData\Local\npm-cache_logs\2021-02-03T21_23_15_246Z-debug.log
[ERROR] An error occurred while running subprocess npm.
npm.cmd i --save -E #capacitor/core exited with exit code 1.
npm resolution error report
2021-02-03T20:47:47.168Z
Found: typescript#4.1.3
node_modules/typescript
typescript#"4.1.3" from the root project
Could not resolve dependency:
peerOptional typescript#"^3.2.1" from react-scripts#4.0.1
node_modules/react-scripts
react-scripts#"4.0.1" from the root project
Fix the upstream dependency conflict, or retry
this command with --force, or --legacy-peer-deps
to accept an incorrect (and potentially broken) dependency resolution.
Raw JSON explanation object:
{
"code": "ERESOLVE",
"current": {
"name": "typescript",
"version": "4.1.3",
"location": "node_modules/typescript",
"dependents": [
{
"type": "prod",
"name": "typescript",
"spec": "4.1.3",
"from": {
"location": "C:\Users\[user]\\source\repos\ionic\my-app"
}
}
]
},
"edge": {
"type": "peerOptional",
"name": "typescript",
"spec": "^3.2.1",
"error": "INVALID",
"from": {
"name": "react-scripts",
"version": "4.0.1",
"location": "node_modules/react-scripts",
"dependents": [
{
"type": "prod",
"name": "react-scripts",
"spec": "4.0.1",
"from": {
"location": "C:\Users\[user]\source\repos\ionic\my-app
}
}
]
}
},
"peerConflict": null,
"strictPeerDeps": false,
"force": false
}
I have faced the same problem in the past. I could only resolve it by manually deleting the dependencies that he was about one by one from the global node_modules folder. Whenever, I would delete one package, it would tell me there is a conflict in another package as well which I kept on deleting and at the end I got the application up and running.

How to fork and npm install in my project

I have a package
I would like to fork it, edit some stuff in order to make it fit into my project, but keep the ability to update from the original master.
I forked the project, and now I am stuck because when I npm install it, I have "unknown module angular-cesium"
the package.json scripts is has follow :
"scripts": {
"ng": "ng",
"demo:start": "ng serve",
"demo:build": "ng build --prod",
"demo:server": "nodemon --exec ts-node --project demo-server/tsconfig.json -- demo-server/src/main.ts",
"lib:build": "ng build angular-cesium; npm run copy:extra-files",
"lib:start": "ng build angular-cesium --watch",
"lib:publish": "npm run lib:build; cd dist/angular-cesium; npm publish; cd ...; npm run docs:push",
"test": "ng test angular-cesium",
"test:ci": "ng test angular-cesium --no-watch --browsers=ChromeHeadless",
"lint": "ng lint angular-cesium",
"e2e": "ng e2e",
"gh-pages": "gh-pages -d docs -b gh-pages",
"copy:extra-files": "cp README.md LICENSE.txt dist/angular-cesium",
"docs:run": "compodoc -p projects/angular-cesium/src/lib/tsconfig.compodoc.json --theme stripe -d docs -n \"Angular Cesium\" --watch --serve",
"docs:compile": "rimraf docs && compodoc -p projects/angular-cesium/src/lib/tsconfig.compodoc.json --theme stripe -d docs -n \"Angular Cesium\"",
"docs:push": "npm run docs:compile && npm run gh-pages && rimraf docs",
"heroku-postbuild": "npm run lib:build; npm run demo:build"
},
I tried to add "prepare:npm run lib:build"
I have the follow error :
Project 'angular-cesium;' does not support the 'build' target.
if I just try a npm publish I get the following
npm ERR! Error: EPERM: operation not permitted, unlink 'C:\Users\Popolee\AppData\Local\Temp\npm-33912-632e340c\tmp\fromDir-ffb525d2\package.tgz'
My question is, how can I fork this library, and make a npm installable custom version that I can edit and install in my project when i want

Facing `Cannot find module '#babel/plugin-transform-react-jsx'` while building

I'm facing the following error while building my (previously working) app with bitbucket pipeline:
...
[4/4] Building fresh packages...
success Saved lockfile.
success Saved 1 new dependency.
└─ babel-core#6.26.3
Done in 22.08s.
🚨 /opt/atlassian/pipelines/agent/build/src/index.js: Cannot find module '#babel/plugin-transform-react-jsx'
at Function.Module._resolveFilename (module.js:470:15)
at Function.Module._load (module.js:418:25)
at Module.require (module.js:498:17)
at require (/opt/atlassian/pipelines/agent/build/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
at /opt/atlassian/pipelines/agent/build/node_modules/parcel-bundler/lib/transforms/babel/jsx.js:51:22
at Generator.next (<anonymous>)
at asyncGeneratorStep (/opt/atlassian/pipelines/agent/build/node_modules/#babel/runtime/helpers/asyncToGenerator.js:3:24)
at _next (/opt/atlassian/pipelines/agent/build/node_modules/#babel/runtime/helpers/asyncToGenerator.js:25:9)
npm info lifecycle parcel-react#1.0.0~build: Failed to exec build script
npm ERR! Linux 4.14.63-coreos
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "build"
npm ERR! node v7.10.1
npm ERR! npm v4.2.0
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! parcel-react#1.0.0 build: `parcel build index.html --public-url ./`
npm ERR! Exit status 1
...
My package.json's script and dependency related lines look like this:
"scripts": {
"start": "parcel index.html",
"build": "parcel build index.html --public-url ./",
"deploy": "firebase deploy --token $FIREBASE_TOKEN"
},
...
"dependencies": {
"axios": "^0.18.0",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"classnames": "^2.2.6",
"firebase": "^5.5.7",
"immutable": "^3.8.2",
"lodash": "^4.17.10",
"mark-twain": "^2.0.3",
"node-sass": "^4.7.2",
"parcel-plugin-markdown": "^0.3.1",
"react": "^0.14.0 || ^15.0.0-0 || ^16.0.0-0",
"react-dom": "^16.2.0",
"react-iframe": "^1.3.3",
"react-redux": "^5.0.7",
"react-router-dom": "^4.3.1",
"redux": "^2.0.0 || ^3.0.0 || ^4.0.0-0",
"redux-actions": "^2.6.1",
"redux-axios-middleware": "^4.0.0",
"simple-markdown": "^0.4.2",
"slate": "^0.38.1",
"slate-plain-serializer": "^0.6.0",
"slate-react": "^0.16.1"
},
"devDependencies": {
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
"firebase-tools": "^3.19.3",
"parcel-bundler": "^1.5.1"
}
Does anyone have an idea what causes this error, and originated from which dependency? I tried to remove all the babel dependencies, just for testing it but still got the error.
In bitbucket, click into the pipelines and in the top right you can access the caches, there you can clear the node_modules cache and rerun again, it should build
Using yarn in the pipeline instead of npm solved the problem. I used yarn in the developement anyways.

npm run build error for bootstrap4 UI Framework Web project

Please I need some help here.
After I type npm run build to my terminal of windows 10, I get the following errors:
'imagemin' is not recognized as an internal or external command,
operable program or batch file. npm ERR! code ELIFECYCLE npm ERR!
errno 1 npm ERR! confusion#1.0.0 imagemin: imagemin img/* -o
dist/img npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the
confusion#1.0.0 imagemin 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\ndunga\AppData\Roaming\npm-cache_logs\2017-10-19T16_46_04_328Z-debug.log
npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! confusion#1.0.0
build: npm run clean && npm run copyfonts && npm run imagemin && npm
run usemin npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the
confusion#1.0.0 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\ndunga\AppData\Roaming\npm-cache_logs\2017-10-19T16_46_04_381Z-debug.log
Here is my package.json file
{
"name": "confusion",
"version": "1.0.0",
"description": "This is a website for Ristorante Con Fusion",
"main": "index.html",
"scripts": {
"start": "npm run watch:all",
"test": "echo \"Error: no test specified\" && exit 1",
"lite": "lite-server",
"scss": "node-sass -o css/ css/",
"watch:scss": "onchange \"css/*.scss\" -- npm run scss",
"watch:all": "parallelshell \"npm run watch:scss\" \"npm run lite\"",
"clean": "rimraf dist",
"copyfonts": "copyfiles -f node_modules/font-awesome/fonts/* dist/fonts",
"imagemin": "imagemin img/* -o dist/img",
"usemin": "usemin contactus.html -d dist --htmlmin -o dist/contactus.html && usemin aboutus.html -d dist --htmlmin -o dist/aboutus.html && usemin index.html -d dist --htmlmin -o dist/index.html",
"build": "npm run clean && npm run copyfonts && npm run imagemin && npm run usemin"
},
"author": "",
"license": "ISC",
"devDependencies": {
"cssmin": "^0.4.3",
"htmlmin": "0.0.7",
"lite-server": "^2.2.2",
"node-sass": "^4.5.3",
"onchange": "^3.2.1",
"parallelshell": "^3.0.2",
"rimraf": "^2.6.2",
"uglifyjs": "^2.4.11",
"usemin-cli": "^0.5.1"
},
"dependencies": {
"bootstrap": "^4.0.0-alpha.6",
"font-awesome": "^4.7.0"
}
}
You don't have imagemin package installed.
npm install imagemin --save
install imagemin-cli and use it like "imagemin": "imagemin img/ --out-dir=dist/img" in package.json
This works for me (Windows 10):
Open index.js file (path: \Bootstrap4\conFusion\node_modules\parallelshell\index.js)
At line 105, instead of "cwd: process.versions.node", change to "cwd: parseInt(process.versions.node)"