Quasar 语言包是针对 Quasar 自身组件的国际化方案，因为其中一些组件包含文案标签。
WARNING
需要注意的是，下面描述的是 Quasar 组件自身的国际化。如果您需要对自己的组件进行国际化，请阅读 App Internationalization 文档页面。
如上所述，部分 Quasar 组件包含文案标签。在国际化方面，一种方式是为每个 Quasar 组件实例（如 QTable）逐一通过 label 属性配置对应语言的文案。这虽然可行，但耗时且增加不必要的复杂度。更好的方式是使用 Quasar 语言包，其中已经为您翻译好了大量标准标签，如 “Cancel”、“Clear”、“Select”、“Update” 等，无需重复翻译！而且开箱即用。
TIP
完整的 Quasar 语言包列表见 Quasar Languages on GitHub。
如果您在列表中没有找到想要的语言，欢迎提交 PR 来添加。只需 5 到 10 分钟，我们热忱欢迎任何语言！
配置默认语言包
除非另行配置（见下文），Quasar 默认使用 en-US 语言包。
硬编码
如果默认的 Quasar 语言包不需要动态决定（例如不依赖于 cookie），那么可以这样配置：
// quasar.config file
framework: {
lang: 'de'
}TIP
对于 Quasar UMD，请查看 UMD / Standalone 页面了解可能还需要在 HTML 文件中引入的标签。
动态配置（非 SSR）
Quasar CLI：如果需要动态选择 Quasar 语言包（例如依赖于 cookie），那么需要创建一个 boot 文件：quasar new boot quasar-lang-pack [--format ts]。这会创建 /src/boot/quasar-lang-pack.js 文件。编辑内容如下：
import { defineBoot } from '#q-app'
import { Lang } from 'quasar'
// 相对于您的 node_modules/quasar/ 的路径
// 请修改为您自己的路径
const langList = import.meta.glob('../../node_modules/quasar/lang/*.js')
// 或者只选择几个语言（下面的示例只包含 DE 和 FR）：
// import.meta.glob('../../node_modules/quasar/lang/{de,fr}.js')
export default defineBoot(async () => {
const langIso = 'de' // ... 通过某种逻辑来决定（使用 Cookies Plugin？）
try {
langList[ `../../node_modules/quasar/lang/${ langIso }.js` ]().then(lang => {
Lang.set(lang.default)
})
}
catch (err) {
console.error(err)
// 请求的 Quasar 语言包不存在，
// 捕获错误以避免应用崩溃
}
})然后将这个 boot 文件注册到 /quasar.config 文件中：
boot: ["quasar-lang-pack"];务必约束动态导入
注意示例代码中使用了 Webpack magic comment - webpackInclude。否则所有可用的语言包都会被打包，导致编译时间和包体积增加。详见 Caveat for dynamic imports
动态配置（SSR）
在处理 SSR 时，不能使用单例对象，因为这会污染 sessions。因此，与上面的非 SSR 动态示例不同（请先阅读它），还必须在 boot 文件中指定 ssrContext：
import { defineBoot } from '#q-app'
import { Lang } from 'quasar'
// 相对于您的 node_modules/quasar/ 的路径
// 请修改为您自己的路径
const langList = import.meta.glob('../../node_modules/quasar/lang/*.js')
// 或者只选择几个语言（下面的示例只包含 DE 和 FR）：
// import.meta.glob('../../node_modules/quasar/lang/{de,fr}.js')
// 注意 ssrContext 参数：
export default defineBoot(async ({ ssrContext }) => {
const langIso = 'de' // ... 通过某种逻辑来决定（使用 Cookies Plugin？）
try {
langList[ `../../node_modules/quasar/lang/${ langIso }.js` ]().then(lang => {
Lang.set(lang.default, ssrContext)
})
}
catch (err) {
console.error(err)
// 请求的 Quasar 语言包不存在，
// 捕获错误以避免应用崩溃
}
})在运行时切换语言包
切换语言包
使用 QSelect 动态切换 Quasar 组件语言的示例：
<template>
<q-select
v-model="lang"
:options="langOptions"
label="Quasar Language"
dense
borderless
emit-value
map-options
options-dense
style="min-width: 150px"
/>
<div>{{ $q.lang.label.close }}</div>
</template>
<script setup>
import { useQuasar } from 'quasar'
import languages from 'quasar/lang/index.json'
import { ref, watch } from 'vue'
const modules = import.meta.glob('../../node_modules/quasar/lang/{de,en-US,es}.js')
const appLanguages = languages.filter(lang =>
['de', 'en-US', 'es'].includes(lang.isoName)
)
const langOptions = appLanguages.map(lang => ({
label: lang.nativeName, value: lang.isoName
}))
const $q = useQuasar()
const lang = ref($q.lang.isoName)
watch(lang, val => {
modules[`../../node_modules/quasar/lang/${val}.js`]().then(lang => {
$q.lang.set(lang.default)
})
})
</script>在运行时修改特定标签
如果需要将某个特定标签修改为其他内容，可以这样做：
import { useQuasar } from 'quasar'
setup () {
const $q = useQuasar()
function changeLabel () {
$q.lang.table.noData = 'Hey... there is no data...'
}
return { changeLabel }
}如果需要在 .vue 文件之外执行此操作（且不在 SSR 模式下），可以：
import { defineBoot } from '#q-app'
import { Lang } from 'quasar'
export default defineBoot(() {
Lang.props.table.noData = 'Hey... there is no data...'
})在项目中使用 Quasar 语言包
尽管 Quasar 语言包是专为 Quasar 组件内部使用而设计的，您仍然可以在自己的网站/应用组件中使用其中的标签。
当前 Quasar 语言包中的 "Close" 标签：
{{ $q.lang.label.close }}在 GitHub 上查看 Quasar 语言包以了解 $q.lang 的结构。
检测地区
Quasar 还提供了一个开箱即用的方法来检测用户所在地区：
// 在 Vue 文件之外使用
import { Lang } from 'quasar'
Lang.getLocale() // 返回一个字符串
// 在 Vue 文件中使用
import { useQuasar } from 'quasar'
setup () {
const $q = useQuasar()
$q.lang.getLocale() // 返回一个字符串
}