I18n-module: trailingSlash option in router does impact i18n root page

[miteyema]

Version

nuxt-i18n: 6.11.1
nuxt: 2.12.2

Nuxt configuration

mode:

• [x] universal
• [ ] spa

Nuxt-i18n configuration

Reproduction Link

https://github.com/miteyema/nuxt-i18n-demo

Steps to reproduce

Configure trailingSlash in router to false

What is Expected?

When I click on any other language, root page url should not have trailing slash, e.g. https://nuxt-i18n-demo.netlify.app/fr

What is actually happening?

When I click on any other language, root page url contains trailing slash, e.g. https://nuxt-i18n-demo.netlify.app/fr/

[rchl]

I've released a beta version with the fix. You can give it a go: npm i nuxt-i18n@beta if you want.

[simplenotezy]

@rchl I just tested this with the beta; I can confirm it still happens with:

<nuxt-link :to="localePath('/')">

Turns into:

/da/

Live test-case with the beta version from tonight: https://thejewelleryroom.com

[simplenotezy]

But it seems to work on some links (e.g. the footer link), but not the header logo that takes you to the frontpage.

[simplenotezy]

I made a temporary workaround:

Vue.prototype.$removeTrailingSlash = (string) => {
    if (typeof string === 'string' && string.substr(-1) === '/' && string !== '/') {
        string = string.substr(0, (string.length - 1));
    }

    return string;
}

And then:

<nuxt-link :to="$removeTrailingSlash(localePath('/'))">
    <svg>
</nuxt-link>

[rchl]

It's always better to use route names in localePath rather than paths. That works in more cases and in cases like this more correctly (kinda regret now that support for paths was added recently).

So if you use localePath('index') then it should work as expected.

I'll have a look if I can fix paths handling also.

[simplenotezy]

I see. Thanks a lot Rafał! @rchl

[rchl]

I wonder how would your server handle a file structure like this one (I suppose it might be like that already):

| - da/
| - da/foo.html
| - da.html
| - index.html

And user visits /da. Would it then load the root da.html file?

Because various node servers that I'm using for testing would kinda fail on it as they see the da directory and try to load index.html from it but since there is none they return 404. They don't fall back to the file in that case.

If that works for you then I can change the code to work like that.

[simplenotezy]

@rchl really interesting you mention this. After pushing the beta version I started noticing weird 404s on eg /shop pages - but only for a short while: https://thejewelleryroom.com/shop - notice it says 404 then shortly after serves the content. Not sure if it is related.

I will have a look at how Cloudflare Workers serves the /da file and get back to you.

[miteyema]

@rchl I think there are still some issues when using trailingSlash and nuxt-i18n.
Please also see issue https://github.com/nuxt-community/nuxt-i18n/issues/787

[rchl]

787 was addressed (somewhat) so I don't see any outstanding issues. Closing.