而且如今的 chatgpt 等软件已经让优质批量化翻译变得简单易用,这篇文章就简单讲讲如何使用多语言框架 vue-i18n 在vue 项目中添加多语言。 安装 在vue 项目中使用如下进行安装: npm install vue-i18n 框架部署 在项目中部署 vue-i18n 比较坑,因为内网和外网大部分关于 vue-i18n 的教程都有点过时了,而且并没有...
vue-i18n 是一个vue插件,主要作用就是让项目支持国际化多语言。首先我们引入这个插件: import Vuefrom'vue'import Vue18nfrom'vue-i18n'Vue.use(Vuei18n); vue插件的使用方法,通过全局方法Vue.use()使用插件。 插件通常会为Vue添加全局功能。插件的范围没有限制-一般有下面几种:添加全局方法或者属性;添加全局资源...
首先,我开发是以 vue 为技术栈,所以如题用的国际化插件是 vue-i18n,附上github 传送门。 1、我们得先有开发环境,先有项目跑起来,我推荐如果是喜欢用 vue 的小伙伴,可以尝试 vue-cli 官方脚手架。这边有我整理的一个脚手架demo,有助于你快速的进行 vue 模块化开发。 2、我们需要安装 vue-i18n, 推荐 npm ...
目前就职于 Shopee,一家做跨境电商的公司,因为业务涉及到多个国家,所以我们各个系统都会涉及到国际化翻译。Vue I18n是 Vue.js 的国际化插件,它可以轻松地将一些本地化功能集成到你的 Vue.js 应用程序中。 本文的源码阅读是基于版本8.24.4进行 我们来看一个官方的 demo 代码语言:javascript 复制 <!DOCTYPEhtml>ES...
在lang 下创建 index.js,使用如上的两种语言包。 import Vue from "vue"; import VueI18n from 'vue-i18n' import zn from "./zn" import en from "./en" Vue.use(VueI18n); // 全局注册国际化包 // 准备翻译的语言环境信息 const i18n = new VueI18n({ ...
笔者目前在 Shopee 工作,我们公司主要业务是跨境电商,业务涉及到多个国家,所以我们各个系统都会涉及到国际化翻译。我们 Vue 项目技术上采用了 Vue-i18n 这个库。
目录 一、安装 vue-i18n 二、语言包 三、全局注册 四、别名配置 五、静态页面国际化 六、动态路由国际化 一、安装 vue-i18n npm install vue-i18n@9.1.9 1. 二、语言包 创建src/lang 语言包目录,中文语言包 zh-cn.ts,英文语言包 en.ts,和index.ts ...
一次加载所有翻译文件是过度和不必要的。 因为可能一直用中文,那么就不会用到英文的数据,就没必要去加载。只在请求的时候去加载它 改动前代码 import { createI18n } from 'vue-i18n'; import dayjs from 'dayjs'; import 'dayjs/locale/zh-cn'; ...
vue-i18n-transform是一个基于Vue.js的多语言转化工具,它扩展了vue-i18n的功能,提供了更多的语言转换选项。通过使用vue-i18n-transform,你可以轻松地将文本、日期、数字等内容转换为不同语言的格式,从而实现更全面的多语言支持。 下面,我们将详细介绍vue-i18n-transform的使用方法。 一、安装vue-i18n-transform 首先,...
Vue国际化 vue-i18n 一、示例 [Vue国际化代码示例](https://github.com/libing-cheer/vue-international-i18n)代码下载后运行以下命令，即可跑起来看到效果。npm run serve 二、目录结构 - 📁src @根 - 📁assets 静态资源目录 - 📁common 字体库 - 📄cn.js 中文字体库 - 📄en.js 英文字体库 - ...