score:0
if you are creating a spa (single page application, notice the single) you won't have any created pages but index. you are trying yo access to a /category
page that's not created because of:
if (page.path === "/") {
page.matchpath = "/*"
createpage(page)
}
that's why your routes don't work (or in other words, only the home page works).
adapt the previous condition to your needs to allow creating more pages based on your requirements.
i'm using gatsby and i want build a single page site, so without create pages. for achieve this i edited gatsby-node.js with the following code:
it's a non-sense trying to build a spa application with gatsby (without creating pages) but then complaining because there's not collection page created.
make sure that you understand what you are doing, it seems clearly that you need to create dynamically pages for each collection
, season
, and product
so your approach to create spa won't work for your use-case.
it's possible to keep just index.js without overcomplicating thing? i just want to understand why my code isn't working 'cause i've passed the correct url... removing the localization gatsby works, so i suspect there is a localization problem
the only way that http://localhost:3001/category-home/prod-foo
(removing the localization) could be resolved is by creating a folder structure such /pages/category-home/prod-foo.js
(since gatsby extrapolates the folder structure as urls), so, if you want to use localization using your approach, add a structure such en/pages/category-home/prod-foo.js
and es/pages/category-home/prod-foo.js
(or the whatever locale), and so on. in my opinion, this is overcomplexitying stuff since, for every category, you'll need to create 2 (even more depending on the locales) files.
gatsby allows you to create dynamic pages and interpolate the locale automatically using built-in plugins on the process, creating each file for the specifically defined locales.
Source: stackoverflow.com
Related Query
- Cannot use gatsby-plugin-intl for single page site
- How to use page query while using root-wrapper for providing Theme with Gatsby
- You cannot use different slug names for the same dynamic path Nextjs
- Is there a secure way to use React.js with a Python Flask backend for a multi-user, password protected site
- How to implement the OAuth2 Authorization code grant with PKCE for a React single page application?
- How to organise components for a single page scrolling website in React?
- react cannot use fileinput twice without refreshing the page
- How to use a Cordova plugin in react JS page
- how to use the Google Tag Manager plugin for gatsby?
- Getting an "Exported queries are only executed for Page components." in Gatsby when trying to generate pages
- gatsby & graphql : filtering for a specific single image
- Gatsby graphql query for GatsbyImage to use a local image from project
- Gatsby plugin image cannot read property 'startsWith'
- Linkedin tracking for single page app in Google Tag Manager
- use a single handler for multiple inputs onChange events
- Cannot read property 'push' of undefined for react use history
- How to create a single Gatsby Page to show and filter all blog posts by tag/category
- Throws cannot use 'in' operator to search for 'validateStatus' error
- How to use useNavigate previous page without accidentally leaving my site
- How to use React for individual site components
- Creating an Alias for an NPM Package in Gatsby Using the Root Import Plugin
- update react state for a single user details page
- Spring single page for every url route and subroute "/a/** => /a/index.html except /a/static/**"
- Use Single React-Toastr Container For All Messages
- Bootstrap Navbar does not work in React JS for single page website
- how to add facebook plugin page to gatsby (react)
- how do i use <redirect/> for redirecting to a different page after login authentication?
- How to use different CSS files for different page with react js
- Can we use Reselect memoization with redux for every single selector (even the silmplest getters)?
- Redux, React for single page application login and logout
More Query from same tag
- TypeError: _initFirebase__WEBPACK_IMPORTED_MODULE_4__.firebase.database is not a function
- Same type to Multiple typescript variable
- How to use .contains() or any other function to see if any part of a string is in an array
- Collapse navbar sooner then 576px
- Pass in a <li> when there is data with ternary operator in React
- Fetch: set variable with fetch response and return from function
- Draft.js: Change color of caret
- React siblings element's refs point to the same element
- React-router v4 updates url but doesn't render component
- How set react-select width depending on biggest option width?
- How to iterate JSON nested array in REACT JS API call?
- TypeError: Cannot read property 'map' of undefined react this.props.rsl['data']
- Unable to connect to mosquitto broker server in mqtt-react
- How to correctly validate and submit if form is valid with ant design form with typescript
- Close material-ui popper when on clickAway
- Redux/React. Getting a stackoverflow loop in Redux-Saga Middleware
- Class constructor type extending another and intersecting at the same time
- React js cannot set property of setstate in axios response?
- How to filter an array of refs
- Pills in bootstrap is not working in react project
- Replace item in array with new value using dispatch in React
- How do I call a react router 4 redirect outside of the render function?
- how to run my node application and react app in the same time with one command?
- Tag is not returning in React JSX
- Redux-Saga call effect always ends on catch block
- How to display Snack Bar Material UI inside if statment
- Pass state onto {children} React hook
- Using Array Method inside ASYNC/AWAIT between API calls in Javascript
- How to save an array of objects in localStorage? Getting TypeError: push is not a function
- React - how to set inline CSS for each element of map function?