memdev/laravel-localization-to-vue

Laravel 包,用于从 resources/lang(和自定义)目录及子目录收集所有本地化文件,并将它们作为 JSON 文件提供

dev-master 2024-03-14 11:24 UTC

This package is auto-updated.

Last update: 2024-09-14 12:29:22 UTC


README

Latest Stable Version Total Downloads Latest Unstable Version License Monthly Downloads Daily Downloads

Laravel Localization To Vue/JSON

此包收集 resources/lang 目录及其子目录中的所有本地化,并将它们转换为普通数组
这些数组可以稍后转换为 JSON 对象,并用于 Vue、Angular 等库。

安装

Laravel 9 之前版本

composer require kg-bot/laravel-localization-to-vue:^1

Laravel 9

composer require kg-bot/laravel-localization-to-vue:^2

Laravel 8+

Laravel 8 需要 PHP 7.3 或更高版本。在运行 composer 之前,请确保您至少有 PHP 7.3。

Laravel 9+

Laravel 9 需要 PHP 8.0.2 或更高版本。在运行 composer 之前,请确保您至少有 PHP 8.0.2。

Laravel 5.5+

Laravel 5.5 使用包自动发现,因此不需要您手动添加 ServiceProvider。

如果您不使用自动发现,请将 ServiceProvider 添加到 config/app.php 中的 providers 数组

KgBot\LaravelLocalization\LaravelLocalizationServiceProvider::class

并且如果您想添加别名,请将以下内容添加到 config/app.php 中的 aliases 数组

"ExportLocalization" => "KgBot\\LaravelLocalization\\Facades\\ExportLocalizations"

设置和配置

您可以通过以下命令导出配置:

php artisan vendor:publish --provider="KgBot\LaravelLocalization\LaravelLocalizationServiceProvider" --tag=config

如果您想解析多个语言目录或其他非 lang_path() 目录,可以在 config 中的 paths.lang_dirs 数组中添加多个路径。

这可以是一个路径或多个路径,例如

paths => [lang_path(), app_path('lang'), app_path('Modules/Blog/lang')]

您可以在导出后运行自己的回调函数,为此您必须注册一个全局可访问的函数,例如在 composer 文件的自载中注册 function.php,并在 config/laravel-localization.php 中添加您的函数,键为 export_callback。示例

// helpers/functions.php

if (! function_exists('testExport')) {
    /**
     * Change all instances of :argument to {argument}
     *
     * @param $string
     * @return void
     *
     */
    function testExport($string) {
        array_walk_recursive($string, function (&$v, $k) { $v = preg_replace('/:(\w+)/', '{$1}', $v); });

        return $string;
    }
}


// composer.json
....
"autoload": {
        "files": [
            "helpers/functions.php"
        ],
        "psr-4": {
            "App\\": "app/"
        },
        "classmap": [
            "database/seeds",
            "database/factories"
        ]
    },
....

// config/laravel-localization.php
...
'export_callback' => 'testExport',
...

用法

此包可以用多种方式使用,我将给出一些示例,但实际上没有限制。

第一个示例是添加视图组合变量并在 blade 视图中使用它。

// inside ServiceProvider

// With alias
use ExportLocalization;

// Without alias
use KgBot\LaravelLocalization\Facades\ExportLocalizations as ExportLocalization;


View::composer( 'view.file', function ( $view ) {

    return $view->with( [
        'messages' => ExportLocalization::export()->toArray(),
    ] );
} );

第二种方式是像请求其他文件一样通过 HTTP 请求它

<script>
let messages = axios.get('https:///js/localization.js') // This is default route which can be changed in config
</script>

为此,您需要在 .env 文件或 config/laravel-localization.php 中启用路由 LARAVEL_LOCALIZATION_ROUTE_ENABLE

您还可以使用 artisan 命令 php artisan export:messages 将消息导出为 ECMAScript 6 标准的 JavaScript 模块

为 npm 本地化包如 Lang.js 导出

如果您需要某些 npm 本地化包(如 Lang.js)识别的特定数组格式。

// Call toFlat() instead of toArray()
ExportLocalization::export()->toFlat()

or

// For CLI usage
php artisan export:messages-flat

一些为什么您会使用此包和消息以及 Laravel 标准本地化的示例

// Inside blade view
<script>
    window.default_locale = "{{ config('app.locale') }}";
    window.fallback_locale = "{{ config('app.fallback_locale') }}";
    window.messages = @json($messages);
</script>
// And optionaly you can then use it in any JavaScript file or Vue.js component

// app.js
import Vue from 'vue';
import Lang from 'lang.js';

const default_locale = window.default_language;
const fallback_locale = window.fallback_locale;
const messages = window.messages;

Vue.prototype.trans = new Lang( { messages, locale: default_locale, fallback: fallback_locale } );
// Example.vue
<b-input v-model="query"
    type="text"
    :placeholder="trans.get('search.placeholder')"
></b-input>

关于 JSON 文件的一个注意事项

Laravel 5.4+ 允许使用单个 .json 文件为每种语言进行结构化本地化,为了使用提供的 json 文件中的字符串,您必须将 __JSON__ 键作为前缀

// Assuming that es.json exists and it is the default locale in your app
{
   "I love programming": "Me encanta programar"
}
// Example.vue
<b-input v-model="query" type="text" :placeholder="trans.get('__JSON__.I love programming')"></b-input>

路由

此包默认公开一个路由 https:///js/localization.js,但您可以在配置文件中更改前缀。

您还可以为 blade 模板或其他任何路由调用提供一个漂亮的路由名称,默认为 route('assets.lang'),但可以通过配置文件的环境文件进行自定义。

建议、评论、反馈

所有这些都非常欢迎并受到赞赏

待办事项

  • 创建排除配置,以便不收集文件/目录

请留下您能想到的任何其他评论,发邮件给我,创建问题,或者您喜欢的方式。

许可

本项目采用MIT许可证授权 - 有关详细信息,请参阅LICENSE.md文件