Trailing slash option

[manniL]

Heyo 👋

it'd be great to have an option for adding/removing trailing slashes for routes coming from localePath. A global setting would suffice IMO and could be applied around the marked lines.

https://github.com/nuxt-community/nuxt-i18n/blob/617e31e8235ffdeb7d345c3b960701b616d94b72/src/plugins/routing.js#L47-L48

trailingSlashes: true

/abc/ -> /abc/ (keeps the same)
/abc -> /abc/ (changes)

trailingSlashes: false

/abc -> /abc (keeps the same)
/abc/ -> /abc (changes)

trailingSlashes: undefined (default)

/abc/ -> /abc/ (keeps the same)
/abc -> /abc (keeps the same)

[rchl]

Being a slightly old dog that worked on pages before frameworks and SPAs, it strikes me as wrong as routes with and without slash can be different routes in Apache for example (one is a file and other a directory with index file). I guess these days that distinction can be blurry (and for less confusion, maybe should be) so I'm not entirely against an option. That is, as long as with Nuxt (and VueRouter) there is always guarantee that those will be handled the same. I'm a bit concerned that it might not be the case...

[manniL]

You are right, "back then" the distinction was exactly that. a folder (+ index) or a file.

Nowadays it doesn't matter a lot and these usually aren't different routes. One variant should be the main one (for SEO purposes, canonical URLs and so on) though.

Also, it'd be a bad experience for the user if /dogs/ puts out sth. different than /dogs.

Vue router handles both kinds equally by default, except if you are enabling strict mode in the vue router "manually", but you'd only do that if you know what you are doing.

[rchl]

OK, then it makes sense.

I do wonder now if it would make more sense for Nuxt to handle that though...

If trailing slashes would be added by Nuxt and it would also add route.pathToRegexpOptions = { strict: true } to all routes, then vue-router would resolve routes with trailing slash preserved.

(I've tested that with some quick hacking and seen it working albeit with some issues when redirecting. But that is probably separate issue in nuxt-i18n.)

[manniL]

I've actually thought about the same but this can only be handled after
vuejs/vue-router#2913 has been resolved.

[manniL]

There we go nuxt/nuxt#6331

[dacxjo]

I was just asking this in https://cmty.app/nuxt/nuxt.js/issues/c9751 a few days ago.

Any workarounds for v2.9.x ?

[manniL]

@dacxjo I'd suggest to upgrade to nuxt-edge if you really need that feature right now ☺️

Ofc you can implement it on your own if you want. You can check what I did in the related PR and mimic that.

[dacxjo]

Got it, thanks @manniL

[gangsthub]

Thanks, @manniL! Solved since Nuxt v2.10.0 👏

[timothymarois]

trailingSlashes: false does nothing while trailingSlashes: true works, trying to disable trailing slash still redirects and then shows 404 pages. This feature still just doesnt work. Even with the latest version of nuxt.

[rchl]

If you have a specific problem then report an issue with all the details.

There is an infinite number of configurations possible (starting from configuration options through different ways of building and deploying) so there is always a chance that some have issues. Saying "it doesn't work" won't help anyone.

[kedrzu]

I think, that what @timothymarois meant, was that when you set trailingSlashes: false option in Nuxt router settings, there is this weird behavior:
Suppose I use prefix strategy and have 2 locales: pl and en. When I go into /pl I am redirected to /pl/ (slash added) and get 404, since trailing slashes are disabled. A workaround would be to set trailingSlashes: undefined.
In that case /pl is still redirected to /pl/, but this time it works (since trailing slash is optional). But this may be not good in terms of SEO.