UI libraries delete page's title when TypeScript is used in project

[Fir3st]

Version

v5.3.0

Reproduction link

https://nuxtjs.org/examples/typescript

Steps to reproduce

1. Create nuxt project with TypeScript
2. Add any UI framework that supports notifications and messages (I've already tested AT UI, Element UI and Ant Design)
3. Add framework into the project
4. Put somewhere notification/message (like in my project, https://github.com/treevity/treevity/blob/antd-message/client/pages/login.vue)

What is expected ?

The package should work without side effects

What is actually happening?

When message/notification disappears, page's title is deleted

Additional comments?

I know, it's weird, and my first thoughts were that's the problem of UI library, but I've tested 3 of them and the problem still persists. When I removed the package from modules, it worked fine. It works fine also for vanilla nuxt project (without TypeScript).

_{This bug report is available on Nuxt community (#c253)}

[Fir3st]

I found it's similar to #151, when I set seo to false, it works fine.

[kevinmarrec]

@Fir3st I think it's not TypeScript related, this is more likely an issue with page meta (vue-meta) being overriden at some moment.

And please provide a ready reproduction repository, not something where steps are installing packages, create or moving files.

[Fir3st]

@kevinmarrec Ok, I've created example repository https://github.com/Fir3st/nuxt-i18n-test with two branches: master and javascript where javascript branch is equivalent to master branch. When you use plain js version, it works fine, but with Typescript (even with plain js page declaration) it causes the issue. And as I wrote before, if you set seo to false, it works fine.

[rchl]

@Fir3st I can confirm that typescript version has the problem while javascript doesn't but I don't know why.

That said, seo = true is pure evil and I'm hoping it will be disabled by default in next major version - #346

Also, while I don't know where the difference in behavior comes from, it might be fixed in latest vue-meta version, I feel. Nuxt is not using vue-meta@2 yet though, so it's hard to test. @pimlie might be interested in this problem.

[pimlie]

Probably similar as reported here? nuxt/vue-meta#396

Thats fixed in vue-meta v2.0.4. Although nuxt will print a warning about a not recommended version, its fine to ignore that warning (note: there is only one breaking change with regards to boolean attributes). So feel free to test vue-meta v2 in your project and report any errors in the vue-meta repo. Thanks!

[kevinmarrec]

@Fir3st @rchl
Will check it out but yeah I'm confused too, TypeScript becomes JavaScript at Webpack build step (ts-loader), so runtime should be same in both TS & JS, really weird that there would be in a issue only with TS.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[rchl]

@Fir3st I've updated your project to work with latest Nuxt (https://github.com/rchl/bugs-nuxt-i18n-typescript-title ) and it works for me there without problems now. So problem seems fixed.

[kevinmarrec]

As a side note, AFAIK this is something that has been fixed through vue-meta@2 that is shipped since Nuxt 2.9. nuxt/vue-meta#396 (comment)