I have run into a problem, where I don't understand what and most importantly why it is not working.
Here is the status quo:
I have recently set up a basic html/css portfolio website using gh-pages. I followed the YouTube tutorial from Traversy Media. On that day everything worked as expected. I had my site up and running and all was good. In the package.json I have added the deploy: gh-pages -d dist script (just like it was mentioned in the video.
Now, I haven't done any work on this website since then and needed to update something tonight. Once I pushed all the changes to the main branch I wanted to deploy to gh-pages again, using the script above. However, all I get from this command is this:
> app#1.0.0 deploy
> gh-pages -d dist
sh: gh-pages: command not found
patricklemmer#Patricks-MBP app %
I was under the impression that this command actually deploys the current version of the site which is sitting on main on the gh-pages branch, so that all the updates are then visible on the website.
Please help me understand, if this thought is wrong already.
What is the correct workflow if I want to push any changes to my live site on gh-pages.
Here is my set up:
Branches
main
gh-pages
My package.json
{
"name": "app",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"deploy": "gh-pages -d dist"
},
"keywords": [],
"author": "",
"license": "ISC",
"homepage": "https://mywebsite.com",
"dependencies": {
"gh-pages": "^4.0.0"
}
}
What am I missing? Although I have worked with Github for a couple of months now, some things just don't seem to stick or makes sense to me. I would appreciate a short explanation of my scenario. I did a lot of Googling before writing this post, but none of the answers/threads helped me so far.
TIA
Related
I'm trying to make changes to the site I have deployed on GitHub Pages, but no matter how many times I deploy it WON'T update the "gh-pages" repo I need it to.
I've updated the code, then deployed about 3 times now and it says "Published":
https://i.imgur.com/0LAXkXy.png
I've given it half hour now to update:
https://i.imgur.com/8TNGFj0.png
but it STILL hasn't applied the changes and is still using the last deployed version:
https://i.imgur.com/Lxd4KwF.png
I've tried clearing cache, I've tried changing random files just to have more changes to deploy and see if it updates, nothing is working.
How do you update GitHub Pages after deploying? It's always been random if it would update or not for me. Sometimes I'll "run deploy" and it will update pages, and sometimes it won't. Right now it's not updating no matter how many times I try.
Do I have to "unpublish" then publish it again with the changes I made? How come it won't just update on a new deploy? Why is it stuck on the deploy I made 2 days ago?
EDIT:
And I have:
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
in the package-json, it's just always random when I actually run "deploy" though whether the "gh-pages" repo ACTUALLY gets updated.
1-The solution was to edit the index.html file in the GitHub website. The website then updates on the web as expected.
Only changing one line into index.html made it "load" the "true" index.html and not all the previous commit.
2-If an empty CNAME file is located in the project then make sure the CNAME file contained a line with the domain you want to be built.
I work with two repo's; one with source code and one with E2E tests using CucumberJS:
application-repo/
application-e2e/
I would like to run npm run watch in the second repo and wait for changes to files in the first repo; because I want to have my CucumberJS tests run on changes to the source-code. The place I work dictate me not to have the e2e-tests in the same repo, as the source code.
Similar question, but with pm2 instead of npm-watch / watch:
Watch files outside the current directory using pm2
It was a lot easier than I thought, at least when using watch and not npm-watch, but probably both can be used the same way.
Here's my package.json of the second repo:
{
"name": "application-e2e",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"watch":"watch 'echo hello' ../application-repo/", // First repo
(...)
When running npm run watch in the second repo, changes made in the first repo will make it write hello in the terminal of the second repo.
I already had published some website on GitHub pages with no issue. My common workflow is to build a website, upload in the root (/) or docs (/docs) directory of my repository and set up GitHub Pages in the settings.
This is my first time using Ionic. I wrote a website and I build it by running ionic build --prod.
Than I uploaded my contents to the /docs directory of the repo.
When I visit the website https://<nickname>.github.io/<myrepo>/ it leaves me in a blank page. Inspecting with Google Chrome dev tools, I can see that scripts are referred to https://<nickname>.github.io/script.js instead of https://<nickname>.github.io/<myrepo>/script.js
How can I make it work? What I am doing wrong?
You can find the full source code of my project here. You can build it by yourself and try if there is something wrong. The site is functional when I execute it on my local web server for testing.
How to make any React website work with GitHub Pages
Prerequisites
npm installed
directory containing the React project
git repository set on this directory and linked to the remote on GitHub
Steps to follow
Run npm install gh-pages --save-dev
Edit the package.json file:
Add this line: "homepage": "http://githubname.github.io/repository". Use your nickname and repository name
Add these lines in the scripts section:
"scripts": {
//...
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
}
Push a commit
git add .
git commit -m "Create a React app and publish it to GitHub Pages"
git push origin master
Your website is available at http://githubname.github.io/repository
For more info see this page
Additional steps for Ionic 5
If you are using Ionic 5, some errors can still occur.
In this case, visit the website on http://githubname.github.io/repository and open the Chrome Inspector Tools (CTRL + SHIFT + I).
Look at the Console: some JS or TS script could be not loaded. You can see that the browser is looking at the scripts in a wrong path.
By manually editing the index.html you can point the script to the right URLs.
Upload the edited index.html in the gh-pages branch of your GitHub repo and you are good to go.
I'm working on making a github page. I'm a beginner with github, but when I go to https://montanabraswell.github.io/example/ it shows the general bootstrap I'm trying to modify. I already made changes in Atom and when I open the index using chrome, the updates are fine and I made sure github is synced. I waited over 10 minutes but no changes have been made. Any thoughts? Thanks!
Did you push the changes to gh-pages?
If not you are not updating the version on your GitHub repository.
Anyway, I highly recommend using npm package gh-pages it makes things much easier for you.
npm install gh-pages --save-dev
and in your package.json
"publish": "gh-pages -d YOUR_BUILD_FOLDER"
I recently gain administration of a Github repo, on my developing server we use composer, im trying to do a composer update, in composer.json i have defined the repo as VCS type pointing to my github repo.
I commit and push some changes to the repo, but when i do composer update it says there is nothing to update. Other than the commit and the push, there is something else i need to do in order to allow composer to see there is an update in the code?
Consider your repo is https://github.com/auraphp/Aura.Web .
You do commit and push updating the repo for the changes.
Composer is a tool to manage the dependencies for a project. So say if you are using this package downloaded via composer, like
composer.json
{
"require": {
"aura/web": "2.0.*#beta"
}
}
and
$ php composer.phar update
You will get the latest version. In order for composer to understand it is updated, you need to first add the package in packagist.org . What you need to do is activate the service hook in https://github.com/<user/org>/<repo-name>/settings/hooks .
You can get more information from respective websites
Packagist
Composer
For a quick start read http://www.sitepoint.com/php-dependency-management-with-composer/ , there will be many if you search in google.
You only specify your repo URL and it will automatically scan your composer.json for package info. Keep in mind that repositories have a higher priority over Packagist when installing or updating.
The template used regularly in various projects is as follows:
"repositories": [
{
"type":"package",
"package": {
"name": "package-name",
"version":"master",
"type": "wordpress-plugin",
"source": {
"type": "git",
"url": "https://github.com/package-name.git",
"reference":"master"
}
}
}
],
"require": {
"package-name": "dev-master"
}