vue-i18n 多语言(国际化) 切换 初学使用不少网站有多语言模式，正好项目里需要多语言切换，简单学习之后，整理成文章，加深记忆。概述Vue I18n 是 Vue.js 的国际化插件，格局比较大，具体怎么解释还是不太好说，直接看用法就能明白。简单说一下为什么叫这个名字：internationalization(i+中间的18个字母+n)。如果你更喜欢看官方文档可以移步下面的官方文档，本文只是基
转载
2024-02-05 00:25:54
446阅读
一、实现国际 首先，我开发是以 vue 为技术栈，所以如题用的国际化插件是 vue-i18n，附上 github 传送门。1、我们得先有开发环境，先有项目跑起来，我推荐如果是喜欢用 vue 的小伙伴，可以尝试 vue-cli 官方脚手架。这边有我整理的一个脚手架 demo ，有助于你快速的进行 vue 模块化开发。2、我们需要安装 v
目录第一步：第二步：第三步：第四步：最后：前言：我们有时候会遇到一个项目需要支持多语言，而用直接翻译的插件时常会导致翻译的结果跟自己预想的有所偏差或者结果太长造成页面结构紊乱而这个时候就需要用到 i18n ，这个插件的作用是创建这个自己的字典，使其切换语言时用到的文案是自己编写的，这样就可以做到实现自己想表达的效果. 话不多说，直接上源码：第一步：首先呢，肯定是先
vue-i18n1. 安装2. 配置3. i18n使用4. 常用方法5. v-t 使用6. 组件插值 最近vue项目遇到需求，将项目全局国际化，要求中、英、日三种语言自由切换，在这里记录一下vue-i18n国际化语言包处理插件的使用，具体可参考: vue-i18n官方文档。1. 安装npm install vue-i18n --save2. 配置src目录下新建i18n目录，en.js英文语
转载
2024-07-08 09:37:02
509阅读
# Vue 2国际化与TypeScript的结合
在现代Web开发中，国际化（i18n）是一个不可忽视的功能。它帮助我们将应用程序本地化，以适应不同文化和地区的用户。在这篇文章中，我们将探讨如何在 Vue 2 中使用 TypeScript 实现国际化功能。我们将详细介绍配置过程，并提供示例代码以帮助您更好地理解。
## 安装依赖
首先，您需要安装 `vue-i18n` 库，这是 Vue 应用
本文为Varlet组件库源码主题阅读系列第十篇，也是最后一篇，读完本篇，可以了解到如何通过创建一个Vue3响应式对象就可以轻松实现国际化的需求。
原创
2022-10-23 01:00:50
65阅读
main.ts引入i18n import { createApp } from 'vue' import App from './App.vue' import router from './router' import store from './store' import ElementPlus ...
转载
2021-09-04 09:10:00
775阅读
2评论
全世界范围内广受欢迎的 Vue UI 框架，一个非常精致的 Material Design UI 套件。Material Design 风格 UI 框架Vuetify 是一个基于 Vue.js 精心打造 UI 组件库，整套 UI 设计为 Material 风格。能够让没有任何设计技能的开发者创造出时尚的 Material 风格界面。Material Design 是 Google 推出的设计语言，
本文为Varlet组件库源码主题阅读系列第十篇，也是最后一篇，读完本篇，可以了解到如何通过创建一个Vue3响应式对象就可以轻松实现国际化的需求。Varlet(https://github.com/varletjs/varlet)组件库支持多语言切换，使用也很简单：!(https://s2.51cto.com/images/blog/202210/20224916_63515fecd931b4883
原创
2022-10-20 22:49:27
271阅读
一、搭建好项目的环境。
二、根据ElementUI官网的自定义主题（http://element.eleme.io/#/zh-CN/component/custom-theme）来安装【主题生成工具】。
首先安装「主题生成工具」，可以全局安装或者安装在当前项目下，推荐安装在项目里，方便别人 clone 项目时能直接安装依赖并启动，这里以全局安装做演示。
npm i element-the
转载
2024-06-06 11:34:15
207阅读
前言： 要实现多语言切换，这时候接触到国际化，前端框架无数，其中几种热门的框架都有相匹配的国际化插件工具。比如：vue + vue-i18n
angular + angular-translate
react + react-intl
jquery + jquery.i18n.property在实际项目中使用的前端框架为Vue，故而我们将使用vue-i18n这个插件进行国际化功能的实现。效果
项目前后端想支持统一的国际化词条，当前端修改语言类型选项时，页面自动刷新同时加载最新的语言词条效果。
基于Typescript的Vue项目配置国际化简介使用vue-i18n插件对基于Typescript的vue项目配置国际化，切换多种语言, 配合element-ui或者其他UI库本文以配置中英文两种语言为例安装安装国际化插件vue-i18nnpm i vue-i18n --save添加locales文件在根目录下(src/)下新建目录 i18n/在src/i18n/目录下新建en.json文件，对
转载
2021-05-17 14:26:13
1165阅读
2评论
这里vue-cli版本是3.0以上的1、创建项目（health-monitoring为项目名称）：vue create health-monitoring2、上下箭头选择：Manually select features（手动选择特性）3、上下箭头键控制移动，空格键控制选中，选完回车 4、选择vue版本，这里选3.0： 5、是否使用class风格的组件语法（选yes）：6、是否使用babel做转义
转载
2023-12-07 09:02:55
149阅读
Viteue3+TypeScript基础知识案例<一>1、学习背景随着前端web应用的需求不断发展和变化，vue生态圈也紧跟开发者步伐，不断演化。尽管vue2.0已经很完善了，很多人掌握的vue2.0，感觉实在学不动了，意料之外的是尤先生继续更新vue到3.0版本，以补充vue2.0的不足之处。随着vue3.0问世，vite2.5.1也油然而生，vue始终没有放弃对项目响应速度和编
转载
2024-01-29 14:12:18
220阅读
Vue3后台管理系统（七）Element-Plus国际化
原创
2023-06-05 13:37:32
1290阅读
Vue3后台管理系统（八）国际化切换组件
原创
2023-06-05 13:44:12
98阅读
在src目录下面建立语言包common下的ch.jsmodule.exports = { messag
原创
2022-08-19 11:38:54
190阅读
Vue CLI 提供内置的 TypeScript 工具支持。
#NPM 包中的官方声明随着应用的增长，静态类型系统可以帮助防止许多潜在的运行时错误，这就是为什么 Vue 3 是用 TypeScript 编写的。这意味着在 Vue 中使用 TypeScript 不需要任何其他工具——它具有一流的公民支持。
#推荐配置 1. // tsconfig.json
2. {
3. "compil
转载
2023-09-12 19:32:17
204阅读
一， 环境配置1.1 安装最新 Vue 脚手架npm install -g @vue/cli
yarn global add @vue/cli1.2 创建Vue3 项目vue create projectName1.3 现有Vue 2 项目 升级到 Vue3vue add typescript二， 进击Vue3三，Vue3 Composition Ap i3.1 关于 Composition A
原创
精选
2024-02-24 10:24:40
347阅读
