说实话，前端国际化这个话题其实挺有意思的，哈哈，尤其是当你的项目需要面向全球用户的时候，你懂的。

Zui近在Zuo一个项目，需要实现前端国际化，咱就是说一开始也是有点懵，不知道如何下手。

不过后来经过一番学习之后才知道前端国际化其实是现代前端开发的标配，不是什么可选项。

我的网站只面向国内用户，要什么国际化 —— 结果业务拓展到海外临时抱佛脚，你懂的。

所以尽早开始国际化，在项目开发初期就考虑国际化问题，Ke以避免后续的重构和修复工作。

目前常用的前端国际化实现方式有几种，港真，我刚接到这个需求的时候，也是不知如何下手。

纯JavaScript: 对于非框架或库的项目，i18next 和 formatjs 是两个强大的国际化库，它们Ke以在任何JavaScript项目中工作。

当然国际化也不例外有hen多成熟的JavaScript i18n库可供选择，下面就来分享一些热门的前端国际化库!

利用JavaScript进行前端国际化，基本上就是围绕着如何管理这些文本、如何加载语言包以及如何替换文本这几个环节来展开的。

基础方案可自行实现，比如使用i18next或者vue-i18n等库来实现。

cd i18n-app npm install npm run serve

默认开发服务器为 http://localhost:。

i18n-app/vite.config.js 中将请求代理到后端，请把 TARGET_URL 改成你本机或内网的后端地址，例如：

const TARGET_URL = 'http://192.168.1.100:3000/'

两个子目录各自为独立 npm 包，可分别安装依赖与启动；本地联调时需先起后端，再配前端代理。

在 MySQL 中创建数据库，例如：

CREATE DATABASE i18n_database DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

按顺序导入 i18n-server/sql/ 下的建表脚本，至少包含：

语言资源管理是国际化的基础，通常通过键值对的形式存储多语言文本。

前端项目的国际化构建流程，核心在于统一管理.vscode插件或专用工具实现翻译协同。

. 代码风格

两个子项目均提供 Prettier：

npm run format        # 写入格式化
npm run format:check  # 仅检查

. 不对不对，应该是“结束语”。 前端国际化是一个复杂的过程，但只要我们选择合适的工具和方法，就Ke以高效地实现多语言支持。害，就这样吧，你懂的！~~~.

. 请自行在仓库中添加许可证文件；在未声明前，本项目代码默认仍归原作者所有。

i18n-app 和 i18n-server 的代码托管在 gitee 上，大家Ke以自行取阅。