diff --git a/README.md b/README.md index 637ecd1..ff53393 100644 --- a/README.md +++ b/README.md @@ -29,6 +29,7 @@ 20. 支持 Markdown 渲染 21. 路径别名 `~` 支持 22. 命令行自动创建与删除 +23. `i18n` 国际化支持

@@ -747,6 +748,60 @@ pnpm run auto:create pnpm run auto:remove ``` +
+
+ +### [23. i18n 国际化支持](https://github.com/intlify/bundle-tools/tree/main/packages/vite-plugin-vue-i18n) + +在日常的业务当中,可能会存在一些需要国际化的场景。那么只需要在根目录下的 `locales` 中定义不同语言的 `yml` 即可在项目中做到开箱即用的国际化支持。 + +比如 `locales/en.yml` 中用来定义需要国际化支持的英文内容。 +```yml +# locales/en.yml +# English + +index: index +about: about +not-found: Notfound +``` +又如 `locales/zh-CN.yml` 中用来定义需要国际化支持的中文内容。 + +```yml +# locales/zh-CN.yml +# 中文 + +index: 主页 +about: 关于 +not-found: 未找到页面 +``` + +此时在组件中即可这样用 👇 +```html + + + +``` + +更详细的说明可见用到的 `vite 插件` 👉 [@intlify/vite-plugin-vue-i18n](https://github.com/intlify/bundle-tools/tree/main/packages/vite-plugin-vue-i18n) 与 `vue插件` [vue-i18n](https://github.com/intlify/vue-i18n-next)。 + +另外 `yml` 是目前前端中流行的配置文件格式,语法可见阮一峰先生的 👉 [YAML 语言教程](http://www.ruanyifeng.com/blog/2016/07/yaml.html)。 + +`vscode` 插件推荐: + +- 多合一的 `i18n` 支持 [i18n Ally](https://marketplace.visualstudio.com/items?itemName=Lokalise.i18n-ally) + +