feat: create with vue-i18n#548
Conversation
cexbrayat
left a comment
cexbrayat
left a comment
There was a problem hiding this comment.
This is a good start.
There should be at least one snapshot test to check that everything works.
Ideally, the should introduced a modified component template to use a translation that could be checked in a test.
| <mapping directory="" vcs="Git" /> | ||
| <mapping directory="$PROJECT_DIR$/playground" vcs="Git" /> | ||
| </component> | ||
| </project> No newline at end of file |
There was a problem hiding this comment.
can you remove all the .idea files that you added to this commit?
|
|
||
| export default createI18n({ | ||
| legacy: false, | ||
| globalInjection: true, |
There was a problem hiding this comment.
I thnink this is the default value, so the line can be removed
| locale: 'en', | ||
| fallbackLocale: 'en', | ||
| messages | ||
| }) |
There was a problem hiding this comment.
Also, when used in TS, there are additional informations that should be added to have a proper typechecking:
https://vue-i18n.intlify.dev/guide/advanced/typescript.html
|
@cexbrayat
I've got it ! |
…5/create-vue into feat/create-with-i18n
|
@cexbrayat |
|
@Procrustes5 Sorry, I should have explained: to add a snapshot test, you don't have to open a PR on create-vue-templates, you have to update the |
|
@cexbrayat |
| 'playwright', | ||
| 'nightwatch' | ||
| 'nightwatch', | ||
| 'vue-i18n' |
There was a problem hiding this comment.
I think it should be removed from here because it's going to generate too many snapshots
| export interface DefineLocaleMessage { | ||
| hello: string | ||
| } | ||
| } |
There was a problem hiding this comment.
I don't think this file should be necessary? With TypeScript, you need to do something like:
import { createI18n } from 'vue-i18n'
import enUS from './locales/en-US.json'
// Type-define 'en-US' as the master schema for the resource
type MessageSchema = typeof enUS
const i18n = createI18n<[MessageSchema], 'en-US'>({
locale: 'en-US',
messages: {
'en-US': enUS
}
})| "types": ["i18n"] | ||
| }, | ||
| "include": ["src/template/config/vue-i18n/**/*", "src/template/config/vue-i18n/**/*.json"] | ||
| } |
There was a problem hiding this comment.
And i think this file can be removed as well?
|
@cexbrayat |
|
@Procrustes5 import { createI18n } from 'vue-i18n'
import enUS from './locales/en-US.json'
type MessageSchema = typeof enUS
const i18n = createI18n<[MessageSchema], 'en-US'>({
locale: 'en-US',
messages: {
'en-US': enUS
}
})Also, as a second step, the generated HelloWorld component could show the usage of |
|
Oh and I forgot something: the PR should also update |
…5/create-vue into feat/create-with-i18n
|
@cexbrayat |
cexbrayat
left a comment
cexbrayat
left a comment
There was a problem hiding this comment.
Nice work. I'm just wondering if the components which are the same in the typescript-default template could not be removed to avoid duplication. Other than that, looks good to me.
| flex-wrap: wrap; | ||
| } | ||
| } | ||
| </style> |
There was a problem hiding this comment.
Is this file necessary? If it doesn't change from the typescript-default versions, then I think it should not be duplicated if possible (same for the other components).
There was a problem hiding this comment.
@cexbrayat
Oh, I'd not understood this architecture yet. Thank you
modified now!
| <div class="greetings"> | ||
| <h1 class="green">{{ msg }}</h1> | ||
| <h3> | ||
| {{ t('greetings.message') }} |
|
@cexbrayat |
2 participants
Description
issue : #545
Added vue-i18n to the option. I made it with the directory structure suggested in the above issue.