vue-i18n在使用$t时提示类型错误

1. 问题描述

Vue3项目中,使用vue-i18n,在模版中使用$t时,页面可以正常渲染,但是类型报错。

相关依赖版本如下:

json 复制代码
"dependencies": {
    "vue": "^3.4.29",
    "vue-i18n": "^9.14.0",
    // 其它依赖
},

2. 解决方法

手动给 $t 添加类型声明。

创建一个类型声明文件vue-i18n.d.ts,并将其添加到 tsconfig.json 配置文件的 include 配置项中。文件内容如下:

ts 复制代码
export {};

declare module '@vue/runtime-core' {
    // 提供全局属性 `$t`
    interface ComponentCustomProperties {
        $t: (message: string) => string;
    }
}

参考文档

相关推荐
Dnn011 天前
修改el-select背景颜色
css·elementui·vue3
sen_shan5 天前
Vue3+Vite+TypeScript+Element Plus开发-22.客制Table组件
vue.js·vue3·vite·element plus·按钮组件·表组件
是二牙6 天前
vue3+vite 多个环境配置
前端·vue3·vite
緑水長流*z6 天前
(03)Vue的常用指令
前端·vue.js·vue3·vue2·vue框架·vue学习笔记·vue学习教程
Edward-tan9 天前
【玩转全栈】—— Django+vue3+讯飞星火API 实现前端页面实时AI答复
vue3·全栈·django5
sen_shan15 天前
Vue3+Vite+TypeScript+Element Plus开发-10.多用户动态加载菜单
vue.js·typescript·vue3·element·element plus·动态菜单·多用户动态加载菜单
Samdy_Chan16 天前
同时支持Vue2/Vue3的图片懒加载组件(支持懒加载 v-html 指令梆定的 html 内容)
前端·vue·vue3·vue2·懒加载·图片懒加载·图像懒加载
USER_A00116 天前
【VUE3】Eslint 与 Prettier 的配置
vue3·eslint·prettier
sen_shan21 天前
Vue3+Vite+TypeScript+Element Plus开发-04.静态菜单设计
前端·javascript·typescript·vue3·element·element plus·vue 动态菜单
qq_3085623122 天前
vue3 中引入tinymce富文本
vue3·富文本·tinymce