I'm currently studying React with manual setup (not using Create-react-app).
I used Webpack and Babel.
After installing 'react-router-dom,' I tried to use URLs with more than one slash for the path attribute in element. For example, "/contact/add"
However, it only returns a blank page with 404 error.
(Btw, it works perfectly when I use only one slash)
I looked around other stackoverflow posts and found that it's an issue with a "client-side" problem.
So, is there any method to handle this issue?
Related
I want to use the optional route parameter feature sveltekit offers but it produces an error.
In my 'routes' folder I created another folder '[[lang]]' but when I want to try it out I get this error:
Error: Invalid param: [lang. Params and matcher names can only have underscores and alphanumeric characters.
I'm pretty new to svelte and sveltekit so any help would be greatly appreciated.
I just tried creating a [[lang]]/home route with the latest SvelteKit and it worked fine.
According to your error, the folder name seems to be detected as [[lang], not [[lang]].
However, when I tried renaming my [[lang]] folder to [[lang] I got a different error: Invalid route /[[lang] — brackets are unbalanced
To help diagnose the actual problem, I suggest creating a github repo with a simple reproduction based on the starter template from npm create svelte#latest
This is the link to my GitHub project, see the directory structure: https://github.com/SutirthaDey/crowdcoin
app link: https://crowdcoins.netlify.app/
I have used react,nextJs, and next routes for dynamic routing. The problem I'm facing is after deploying it using netlify, everything is working fine but when I do a refresh, it's showing 404 pages not found(except the main index.js page/landing page). I don't know whether I was doing it appropriately but tried several things like using netlify.toml and _redirects but nothing really worked. Other than the refreshing part, everything is working fine.
I was stressing out for days over this its such unique problem that I couldn't find the answer too anywhere. I also followed the same Solidity tutorial as you and unfortunately the tutorial is very out of date so a lot of things don't really work. I had the exact same issue as you when trying to build on netlify. It took a while to figure out but basically the next-routes package does not work with netlify. So you will have to set up your routes just using vanilla Next.js. So delete the server.js and routes.js files then search up how to create routes using Next.js I would suggest these tutorials they are very good! Next routes tutorials. Hopefully this helps others I don't want anyone else to go through what I had to go through lol
I uploaded alot of react packages. Some update caused the # to be removed from the url. Works on dev machine but not on production which runs apache. I tried all different kind of rewrite in virtual host but I can't get it to work.
I need to add the # again. Must be some option som react router package?
Sorry for not specifying exactly what react packages it is. I updated so many I don't really know which it is. Production is down cause of this so it's an emergency. I promise to clean up the question once it's back up.
react-router-dom has HashRouter component. You can use that.
I'm using react-router-dom. I've found that when a user modifies the querystring of the current page to add a final "%", the app crashes and the following error is printed in the console:
URIError: Pathname "/search%" could not be decoded. This is likely caused by an invalid percent-encoding
I've found in their GitHub repository that the error is related to some issue they have with the history dependency, but not fix for it.
Does anyone know what can be done about it? I don't seem to find a way to take control over the parsing of the URL.
Thanks.
I am building an Single-Page-Application where the front end is using ReactJS, and React Router.
The application shall be hosted with conventional app server either Tomcat or Weblogic (just due to whatever reason as required by our client).
My question is straight forward: in React, how could I get the application context path which is equivalent to request.getContextPath() as in jsp? I did many searching in google, but none of it could just give me a straight to the point answer. Whether react having such equivalent function? Or if I could grab this path from JSP? If so, how to grab it?
Thanks.
I had this problem as well and solved it like this:
In reactjs, when you are building your app for production, you need to run "npm run build".
To build it correctly, you need to set the homepage property in package.json to the main url of your site.
In my case I am using http://localhost:3000 for local development, and http://localhost:8080/myapp for stage testing.
That app needs to know if there is a "myapp" in the url or not. This is basically the problem of this post.
My answer is, because you need to specify the homepage property in package.json anyway, I am using this value to find my context path.
I am doing this like this:
{packageJson.homepage.substring(packageJson.homepage.lastIndexOf("/"))+"/login"}
For my test environment this returns: /login
For my stage environment this returns: /myapp/login
Maybe this helps.