I use nuxt.js + vue.js. I need to create case sensitivity of routers. I found the following property: caseSensitive. I’m trying to put it into nuxt.config but it doesn’t work, the transition is possible by links in upper case. If I directly change the file ~project/.nuxt/router.js, everything works correctly. Help me to figure it out.
router: { extendRoutes (routes) { for (let key in routes) { routes[key]['caseSensitive'] = true } }
Advertisement
Answer
Your code seems to be good. I have tested it, here is mine :
// nuxt.config.js router: { extendRoutes(routes) { for (const key in routes) { routes[key].caseSensitive = true } } }
To be more accurate, the nuxt documentation allows to customize routes with router.extendRoutes
property in nuxt.config.js
. As it said, for each route :
The schema of the route should respect the vue-router schema
So you need to look at the documentation of vue-router where you can find the caseSensitive
property.
Important note 1 : This option is available for Vue 2.6.0+ available for Nuxt 2.5.0. So Nuxt version must be at least >= 2.5.0.
Important note 2 : Be sure to call the right url and make your cache empty. I had the same issue because when I enter my url into Chrome search input browser, chrome automatically changed it into lowercase. In fact it used history of my previous request and not the request I wanted.