在特定页面中添加自定义网络资产

Question

我正在尝试为我的项目添加google map搜索功能，但我为此找到了一个非常不错的反应代码（https://github.com/ubilabs/react-geosuggest），但无法将其添加到管理面板中。问题是我无法将自定义JavaScript文件添加到easyadmin。在说明文件中，我们说可以添加如下所示的自定义网络资产

- '/bundles/user/js/admin4.js'
- 'bundles/app/js/admin5.js'

但是我不知道应该将自定义javascript文件放在哪个文件夹中。在easyadminbundle示例中，有一个自定义的demo.css，它位于/src/Resources/public/stylesheets文件夹下；我尝试过类似的方法，但是没有用。

然后我尝试使用webpack encore添加此自定义javascript文件，但随后我发现我的webpack资产未加载到easyadmin中。

所以我很困惑，希望您能帮助我了解如何添加自定义JavaScript。

Answer 1

在特定页面中添加自定义网络资产

根据documentation：

添加模板选项（全局或仅某些实体），以定义用于渲染界面各部分的Twig模板的路径

# config/packages/easy_admin.yaml
easy_admin:
    design:
        # these custom templates are applied to all entities
        templates:
            edit: 'admin/custom_edit_form.html.twig'
    entities:
        Customer:
            # ...
            # these custom templates are only applied to this entity and
            # they override any global template defined in 'design.templates'
            templates:
                edit: 'admin/customer/edit.html.twig'
                new: 'admin/customizations/customer_new.html.twig'

这些文件位于templates文件夹中。

然后扩展easyadmin的默认模板：

{# templates/admin/new.html.twig #}
{% extends '@EasyAdmin/default/new.html.twig' %}

{% block head_custom_stylesheets %}
    {# ... customize the stylesheets with webpack-encore or rel element #}

{% block body_custom_javascript %}
    {# ... customize the javascripts with webpack-encore or script ... #}
{% endblock %}

您可以访问模板其余部分的所有操作（例如，使用全局twig变量）

EasyAdmin添加自定义Web资产

1 个答案:

在特定页面中添加自定义网络资产