将Symfony翻译传递给Symfony webpack Encore

2022-02-24 00:00:00 javascript symfony twig webpack-encore

对于symfony,我使用translation、Twig和Webpack encore组件。

我可以用以下命令翻译前端小枝:

'my_key'|trans

我使用命令yarn encore dev生成Myapp.js,但PHP translation component在Javascript中无法访问。

我有很多东西要用javascript翻译。

php

遗憾的是,由于js不是由推荐答案处理的,扩展起来也不是由symfony处理的,因此您将无法访问js文件中symfony的翻译组件。

当您没有太多需要传递的翻译时,一种可行的解决方法是在twig模板内创建一个JS数据对象作为symfony应用程序的一部分,然后从js文件访问它。大致如下:

# inside your twig template, e.g. index.html.twig
{% block javascripts %}
    <script type="text/javascript">
    const TRANSLATION_MAP = {
        'my_key': "{{ 'some_key '|trans }}",
        'my_other_key': "{{ 'other_key '|trans }}"
    };
    </script>

    {{ parent() }} # This loads all your js files which can then access the translation map defined above
{% endblock %}

此解决方案的缺点是,您必须决定将哪些键放入您的转换映射中,而实际上并不知道它们是否被使用,因此这可能会变得有点低效且难以遵循。此外,您还必须注意翻译后的内容是有效的json。您可以应用(自定义)转义/筛选来确保这一点,但仍会使其变得有点脆弱。

总而言之,这可能不是最好的解决方案,但对于较小的项目来说,这可能是一个不错的解决方案,直到您发现它变得更加麻烦,并且您必须找到更复杂的解决方案。

相关文章