Github Pages React App index.html file not in root - html

I have researched extensively and have not been able to find an answer to this issue. I’m thinking it might still not be solved! Is there any way to change the path of a React app (in webpack) so that the index.html file can be in the root, and not in a public folder? This would be so I can host my portfolio on github pages, which requires the index.html file to be in the root.

You can assign the publicPath as root in output in webpack config file
like
output: {
filename: '[name].js',
publicPath: '/',
},

Related

Github can't find index.html in /src using webpack

I'm trying to host my website onto github through gh-pages but keep getting "If this is your site, make sure that the filename case matches the URL.
For root URLs (like http://example.com/) you must provide an index.html file."
Not sure what is wrong. I haven't had this problem when i host without using webpack but i gotta learn. Any help would be greatly appreciated!
webpack setup
Your index.html should be at the top level. Keep it outside src where you've your webpack.config.js file, this will help gh-pages to locate your index.html while deploying it.

How can I get my index.html file moved into my /dist/ folder in Webpack?

I currently have my directories setup such that my whole React project, including index.html, is inside my src/ directory. When I run npm run build, all of my .js/css files are put into my /dist folder. However, my index.html isn't being included. I installed html-loader and set it up in my webpack.config.js as such:
{
test: /\.html$/,
include: APP_DIR, //let APP_DIR = path.resolve(__dirname, 'src')//
loader: 'html-loader'
}
My understanding was that this would add my index.html file into my dist/ after running a build but it's not. I've looked at the html-webpack-plugin but what I gather from that is that it generates an index.html file for you but I don't need one generated for me. I just want to include the one I already created.
I later realized that the html-webpack-plugin allows for a template option which, in my case, would be my own src/index.html file. It just copies it over into the index.html it generates in my dist/ folder.

Website doesn't display after uploading the Yeoman created site

I am using Yeoman to create a static website, which created a file structure like:
-app
index.html
-css
style.css
-js
script.js
Gruntfile.js
README.md
bower.json
package.json
I used filezilla to send this to my server (using bluehost) but nothing seems to be displaying? when I try to hit the website. (ex. whatever.com)
Is it because my 'index.html' lives inside the app directory? Should I only host my app diretory so 'index.html' is in the root directory?
I think you are on the right track with location of index.html but not quite. Your file structure should look like:
[document root]
index.html
- css (a directory of the root)
style.css
- js (also a directory of the root same as css)
script.js
Gruntfile.js
README.md
bower.json
package.json
Note in the above structure, there is no -app folder. You can test the above by using your web browser and pointing to http://yoursite.domain/app and see if that displays.
If that does not solve the issue, then you may be uploading to somewhere outside of the document root for your web server in which case you should find out where that is. Best place to ask about that would be on either https://serverfault.com/ or on https://superuser.com/. Good luck.

Can not find post file in github by using jekyll

This is my github pages . I have already create gh-pages brench.
I want to create markdown file and use jekyll to convert it to .html file.
It can be successfully shown on my localhost.
(auto-generate _site and .html pages)
But I upload the whole directory to github .
The index file can be loaded , but post file cannot.
(click the post link,it show 404 error page.)
What happened to this ?
This is my jekyll github link:
https://github.com/larrywhy/jekylldemo/blob/gh-pages/index.html
This is my pages:
http://larrywhy.github.io/jekylldemo/
At _config.yml file, change the baseurl from "/jekyll_demo" to "/jekylldemo".
You misspelled.

Use Hugo to render html files

I am using Hugo http://hugo.spf13.com/overview/introduction to render a folder with html/css/js files as localhost in my laptop.
I have html files in /content and all js/css/img files in /static folder
This is content in config.toml
baseurl = "http://localhost"
contentdir = "content"
languageCode = "en-us"
title = "my new hugo site"
I did hugo server and it rendered /public folder just fine. But all .html files now turning into .xml files and I cannot open them in browser like http://localhost:1313/index.html or so.
What did I do wrong?
Did you setup a theme yet? Without a theme, Hugo will render files as XML, if you read the documentation on themes, that should give you what you need.
First you have to clone themes from github.com/spf13/hugoThemes
In my case I did'nt have git install in my test machine here are the things that I did:
1) Download theme from github.com/spf13/hugoThemes
2) Extract theme to /path/themes
3) Run hugo --theme='themename'