antonioprimera / laravel-js-localization
Laravel JS 前端的本地化。
Requires
- php: >=8.1
- antonioprimera/filesystem: ^v1.6
- illuminate/console: >=11.0
- illuminate/http: >=11.0
- illuminate/support: >=11.0
Requires (Dev)
- laravel/prompts: ^0.1.0@dev
README
此包提供了一个简单的方法来管理 Laravel 中的本地化,使用 Vue3 和 InertiaJS。虽然它非常具有意见性,但使用起来非常简单,无需额外配置。
工作原理
- 您创建 PHP 语言文件,就像您通常在 Laravel 中做的那样
- 您运行
npm run lang
命令以监视语言文件的变化并生成相应的 JSON 文件 - ServiceProvider 将自动将生成的 JSON 文件(对应于当前区域设置)与您的 InertiaJS 应用程序共享
- 您可以在 Vue3 组件中使用 "txt(...)" 辅助函数访问本地化字符串,就像在 Laravel 中使用
__()
辅助函数一样 - 就是这样!简单易懂!
安装
composer require antonioprimera/laravel-js-localization
安装包后,您应运行 install
命令,该命令将发布包配置文件并设置必要的 npm 脚本来监视语言文件的变化并生成相应的 JSON 文件。
php artisan js-localization:install
这将执行以下操作
- 在项目根目录中创建语言监视器 js 文件的符号链接。
- 将 'lang' npm 脚本添加到您的 package.json 文件中,以便您可以运行 'npm run lang' 来启动语言监视器。
- 将
laravel-inertia-vue-translator
、chalk
和chokidar
npm 包添加到您的 package.json 文件中。最后,它运行npm install
来安装新添加的 npm 包。 - 可选:发布包配置文件(您也可以使用
php artisan vendor:publish --tag=js-localization-config
手动执行此操作)。 - 可选:发布语言文件,如果项目根目录中没有 "lang" 文件夹(您也可以使用
php artisan lang:publish
手动执行此操作)。 - 为您提供将相应的 Inertia 插件手动添加到您的 Vue3 应用程序的必要步骤(来自步骤 3 中安装的
laravel-inertia-vue-translator
包)。
警告!!!
install
命令包含一些自动化步骤,这些步骤会向您的文件中注入代码。尽管它试图尽可能安全,但始终建议检查对您的文件所做的更改,并保持干净的 Git 历史,这样您就可以在出现问题的情况下轻松回滚更改。
用法
Laravel
为了使用此包,您需要在 lang
目录中创建您的语言文件,就像您通常在 Laravel 中做的那样。您可以为每种语言创建多个文件,每种语言对应于 lang
目录中的一个目录。
目前,此包仅支持 .php 语言文件,但计划未来支持 JSON 文件。
在处理语言文件时,您应使用 npm run lang
命令运行文件监视器。监视器在 lang
目录中为每个找到的区域设置创建一个 _.json 文件,其中包含该区域设置的翻译。这些文件会自动与您的 InertiaJS 应用程序共享,因此您可以在 Vue3 组件中访问翻译(仅共享当前区域设置的翻译)。
此包也处理字符串的复数形式,与Laravel类似。您可以在字符串中使用:count
、:value
或:n
占位符,当使用txts(...)
辅助函数时,它们将被计数值替换。
// resources/lang/en/example.php return [ 'welcome' => 'Welcome to our application!', 'apples' => '{0} :name has no apples|{1} :name has one apple|[2,10] :name has :count apples|[11,*] :name has too many apples!', ];
Inertia + Vue3
laravel-inertia-vue-translator
包导出2个辅助函数,这些函数直接注册在Inertia对象上,您可以在Vue3模板中使用这些函数来翻译字符串。
- txt(key, replacements = {}): 此函数用于访问本地化字符串。它的工作方式与Laravel中的
__()
辅助函数类似。 - txts(key, count, replacements = {}): 此函数用于访问复数本地化字符串。它的工作方式与Laravel中的
__()
辅助函数类似,但期望第二个参数为一个数字,该数字用于确定字符串的复数形式。
<template> <div> <h1>{{ txt('example.welcome') }}</h1> <p>{{ txts('example.apples', 5, {name: 'Mary'} }}</p> </div> </template>
为了在Vue3脚本部分使用txt(...)
和txts(...)
辅助函数,您需要从包中导入useTranslator
函数,该函数将txt(...)
和txts(...)
函数注入到当前Vue3组件中。
<script setup> // Import the useTranslator function from the laravel-inertia-vue-translator package import { useTranslator } from 'laravel-inertia-vue-translator'; // Inject the txt(...) and txts(...) functions into the current Vue3 component const { txt, txts } = useTranslator(); // Use the txt(...) and txts(...) functions to access the localized strings const welcome = txt('example.welcome'); const apples = txts('example.apples', 5, {name: 'Mary'}); </script>
LocaleManager
此包还提供了一个LocaleManager
外观,您可以使用它来在Laravel应用程序中处理地区。外观提供了以下方法
use AntonioPrimera\LaravelJsLocalization\Facades\LocaleManager; // Get all the available locales via: config('app.available_locales', ['en']) $locales = LocaleManager::availableLocales(); // Get the default locale via: config('app.locale', 'en') $defaultLocale = LocaleManager::defaultLocale(); // Get the fallback locale via: config('app.fallback_locale', 'en') $fallbackLocale = LocaleManager::fallbackLocale(); // Get the current locale via: app()->getLocale() $locale = LocaleManager::currentLocale(); // Get the locale for the authenticated user, fallback to the session locale and then to the default locale $userLocale = LocaleManager::authenticatedUserLocale(); // Set the locale for the current request and store it in the session LocaleManager::setLocale('en'); // Store the locale in the session (will not change the current locale) LocaleManager::setSessionLocale('en'); // Get the locale from the session $locale = LocaleManager::sessionLocale(); // Check if a locale is available (checks the available locales) $available = LocaleManager::isValidLocale('en');
配置
运行install
命令后,包的配置文件会被发布到Laravel应用程序的config
目录。您可以使用此文件根据需要配置包。
以下是默认配置文件,其中解释了默认值
return [ /** * The folder where the language files are stored, relative to the project root * * By default, the language files are stored in the 'lang' folder in the project root. */ 'language-folder' => 'lang', /** * The class that sets the locale in the app * * This class must implement AntonioPrimera\LaravelJsLocalization\Interfaces\LocaleSetter. * By default, the UserSessionLocaleSetter is used, which tries to determine the locale from the authenticated user, * if a user is logged in, then falls back to the session locale, and finally to the default app locale. * Replace this with your own class if you have a different way of determining the locale. */ 'locale-setter' => \AntonioPrimera\LaravelJsLocalization\LocaleSetters\UserSessionLocaleSetter::class, /** * The property of the authenticated user model that holds the locale * * If you have a property in your user model, that holds the locale of the user, you can set it here, * and the locale will be set to the value of this property when the user is authenticated. * You can leave it commented out if you don't have such a property on your user model. */ 'user-locale-property' => 'language', ];