Git Product home page Git Product logo

Comments (13)

gaearon avatar gaearon commented on March 28, 2024 1

You can use my "todos" repo as good testbed. (Make sure to switch to branch with the biggest number.) Then play with opening /active or /completed and refreshing.

from create-react-app.

gaearon avatar gaearon commented on March 28, 2024

Feel free to jump in to help!

from create-react-app.

sotojuan avatar sotojuan commented on March 28, 2024

I got this, will do a PR soon-ish. Can we just require the package.json in the Webpack config and get the homepage from there? What would be a working default if not set? Just need a bit more info!

from create-react-app.

gaearon avatar gaearon commented on March 28, 2024

Can we just require the package.json in the Webpack config and get the homepage from there?

Yes, I think so.

What would be a working default if not set?

If not set, assume we want to serve from /. Otherwise extract path from the URL.

from create-react-app.

selfup avatar selfup commented on March 28, 2024

@sotojuan Would be great to set homepage path!

Thanks for taking the initiative

from create-react-app.

selfup avatar selfup commented on March 28, 2024

The hard part with gh-pages is that we would need the new index.html to be at root, and then reference the files in the build dir.

I made a script that deletes everything but src, node-modules, and build. And copies the files in build so that they are at root for gh-pages. Let me know if that could help a bit or if the webpack route is the better way and then just figuring out how to update the index.html for gh-pages

from create-react-app.

gaearon avatar gaearon commented on March 28, 2024

I’m a bit confused about what you mean. npm run build should produce index.html in build that references local files. The only thing we need to fix is the publicPath setting so it contains paths relative to the actual website.

from create-react-app.

selfup avatar selfup commented on March 28, 2024

gh-pages looks at the root index.html

Does it look inside of build as well?

from create-react-app.

selfup avatar selfup commented on March 28, 2024

Inside of: ./node_modules/react-scripts/config/webpack.config.prod.js

  output: {
    path: buildPath,
    filename: '[name].[chunkhash].js',
    chunkFilename: '[name].[chunkhash].chunk.js',
    // TODO: this wouldn't work for e.g. GH Pages.
    // Good news: we can infer it from package.json :-)
    publicPath: './'
  },

When I changed the public path to "./" everything works!

Running hs for http-server still works as well.

Now how could we avoid the react-router issues you were concerned about?

from create-react-app.

gaearon avatar gaearon commented on March 28, 2024

We can’t avoid it with ./. It won’t work correctly.
We’ll need to think more about this.

from create-react-app.

selfup avatar selfup commented on March 28, 2024

Ok thanks for continuing the discussion. I'll mess around with adding routes and seeing what works or not.

from create-react-app.

meghprkh avatar meghprkh commented on March 28, 2024

Another thing is passing publicPath to dev server doesnot work well with history api fallback. See webpack/webpack-dev-server#518 and webpack/webpack-dev-server#216

from create-react-app.

meghprkh avatar meghprkh commented on March 28, 2024

If this is done using any kind of config, it must be in such a way IMO that the publicPath should be accessible from the main code.

from create-react-app.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.