将CSS和JS嵌入到特定的Laravel视图/刀片模板中

Question

我刚刚开始使用 Laravel，并从 codecayone 购买了模板。一切都很完美，只有一件事：

• 模板使用 config/custom.php 为每个视图定义 css/js 文件。

<?php


return [
    'name' => env('APP_NAME', 'PriPor'),
    'public' => [
        'favicon' => 'media/img/logo/favicon.ico',
    'global' => [
      'css' => [
        'assets/css/app.css',
        'assets/css/vendor~demo_form_editors.css'
      ],
      'js' => [
        'assets/js/vendor~app~dashboard_analytics~dashboard_ecommerce~demo_add_product~demo_calendar~demo_datatable~dem~699a60a5.js',
        'assets/js/vendor~app~demo_form_editors.js',
        'assets/js/app.js',
        'assets/js/vendor~demo_form_editors.js',
        'assets/js/demo_form_editors.js'
      ],
    ],
    'pagelevel' => [
      'css' => [
        'analytics_dashboard' => [ ],
        'ecommerce_dashboard' => [ ],
        'ecommmerce_product_detail' => [
          'assets/css/ecommerce.css'
        ],
        'ecommmerce_add_product' => [
          'assets/css/ecommerce.css',
          'assets/vendors/dropzone/dropzone.css'
        ],
        'ecommmerce_checkout' => [
          'assets/css/ecommerce.css'
        ],
        'jstree' => [
          'assets/css/vendor~demo_jstree.css'
        ],
        'image_cropper' => [ ],
        'sweetalert' => [ ],
        'toastr' => [
          'assets/vendors/toastr/toastr.min.css'
        ],
        'dropzonejs' => [
          'assets/vendors/dropzone/dropzone.css'
        ],
        'editor' => [
          'assets/css/vendor~demo_form_editors.css'
        ],
        'wizard' => [
          'assets/css/vendor~demo_form_wizard.css'
        ],
        'britechart' => [
        ],
        'data_table' => [
          'assets/vendors/datatable/datatables.min.css'
        ],
        'vector_map' => [
          'assets/vendors/jqvmap/jqvmap.min.css'
        ]
      ],
      'js' => [
        'analytics_dashboard' => [
          'assets/js/vendor~dashboard_analytics~dashboard_ecommerce~demo_chartjs~demo_widget~ecommerce.js',
          'assets/js/dashboard_analytics.js'
        ],
        'ecommerce_dashboard' => [
          'assets/js/vendor~dashboard_analytics~dashboard_ecommerce~demo_chartjs~demo_widget~ecommerce.js',
          'assets/js/dashboard_ecommerce.js'
        ],   
        'calendar' => [
          'assets/js/vendor~demo_calendar.js',
          'assets/js/demo_calendar.js'
        ],
        'kanban_board' => [
          'assets/js/vendor~demo_dual_listbox~demo_kanban_board.js',
          'assets/js/demo_kanban_board.js'
        ],
        'chat' => [],
        'management.all-wallet' => [
          'assets/js/vendor~dashboard_analytics~dashboard_ecommerce~demo_chartjs~demo_widget~ecommerce.js'
        ],
        'ecommmerce_products' => [
          'assets/js/vendor~dashboard_analytics~dashboard_ecommerce~demo_chartjs~demo_widget~ecommerce.js'
        ],
        'ecommmerce_product_detail' => [
          'assets/js/vendor~dashboard_analytics~dashboard_ecommerce~demo_chartjs~demo_widget~ecommerce.js',
          'assets/js/ecommerce.js',
          'assets/js/ecommerce_product_detail.js'
        ],
        'ecommerce_add_product' => [
          'assets/js/ecommerce.js',
          'assets/js/vendor~demo_add_product~demo_dropzone.js',
          'assets/js/demo_add_product.js'
        ],
        'ecommmerce_checkout' => [
          'assets/js/vendor~dashboard_analytics~dashboard_ecommerce~demo_chartjs~demo_widget~ecommerce.js',
          'assets/js/ecommerce.js',
        ],
        'profile' => [
          'assets/js/vendor~dashboard_analytics~dashboard_ecommerce~demo_chartjs~demo_widget~ecommerce.js',
          'assets/js/demo_chartjs.js',
        ],
        'dual_listbox' => [
          'assets/js/vendor~demo_dual_listbox~demo_kanban_board.js',
          'assets/js/demo_dual_listbox.js',
        ],
        'jstree' => [
          'assets/js/vendor~demo_jstree.js',
          'assets/js/demo_jstree.js'
        ],
        'image_cropper' => [
          'assets/js/vendor~demo_crop_image.js',
          'assets/js/demo_crop_image.js',
        ],
        'sweetalert' => [
          'assets/js/vendor~demo_sweetalert.js',
          'assets/js/demo_sweetalert.js'
        ],
        'toastr' => [
          'assets/js/vendor~demo_toastr.js',
          'assets/js/demo_toastr.js'
        ],
        'dropzonejs' => [
          'assets/js/vendor~demo_add_product~demo_dropzone.js',
          'assets/js/demo_dropzone.js'
        ],
        'editor' => [
          'assets/js/vendor~demo_form_editors.js',
          'assets/js/demo_form_editors.js'
        ],
        'add-job' => [
          'assets/js/vendor~demo_form_editors.js',
          'assets/js/demo_form_editors.js',
          'assets/js/demo/demo-select2ssssssssssssssss.js'
        ],
        'input_mask' => [
          'assets/js/vendor~demo_input_mask.js',
          'assets/js/demo_input_mask.js'
        ],
        'select2' => [
          'assets/js/demo/demo-select2.js'
        ],
        'wizard' => [
          'assets/js/vendor~demo_form_wizard.js',
          'assets/js/demo_form_wizard.js'
        ],
        'britechart' => [
          'assets/js/vendor~demo_britecharts.js',
          'assets/js/demo_britecharts.js'
        ],
        'chartjs' => [
          'assets/js/vendor~dashboard_analytics~dashboard_ecommerce~demo_chartjs~demo_widget~ecommerce.js',
          'assets/js/demo_chartjs.js'
        ],
        'data_table' => [
          'assets/js/vendor~demo_datatable.js',
          'assets/js/demo_datatable.js'
        ],
        'google_map' => [
          'assets/js/vendor~demo_google_map.js',
          'assets/js/demo_google_map.js'
        ],
        'vector_map' => [
          'assets/js/demo_jqvmap.js'
        ]
      ]
    ]
  ]
];

它工作正常，但不是我额外添加的部分，例如：

'add-job' => [
          'assets/js/vendor~demo_form_editors.js',
          'assets/js/demo_form_editors.js',
          'assets/js/demo/demo-select2ssssssssssssssss.js'
        ]

我测试过：

• 在旧密钥中添加额外的资产嵌入，例如：ecommerce_dashboard，... -> 它有效并且文件嵌入到输出 HTML 结果中。
• 添加一个新键：'add-job'，重新检查数组格式是否正确，清除所有缓存，但文件没有嵌入。它不会对旧密钥造成任何错误，但只有新密钥上的 CSS/JS 未嵌入。

default.blade.php 文件：

  {{-- Global Theme Styles (used by all pages) --}}
  @if(!empty(config('custom.public.global.css'))) 
    @foreach(config('custom.public.global.css') as $style)
      <link href="{{ asset($style) }}" rel="stylesheet" type="text/css"/>
    @endforeach
  @endif  

  @if(isset($action) && !empty(config('custom.public.pagelevel.css.'.$action))) 
    @foreach(config('custom.public.pagelevel.css.'.$action) as $style)
      <link href="{{ asset($style) }}" rel="stylesheet" type="text/css"/>
    @endforeach
  @endif  

我应该做什么以及在哪里调试这个问题？

我希望在此 config/custom.php 文件中添加额外的键，以便根据我的需要为每个视图/刀片模板定义新的 CSS/JS。

Answer 1

您的

'add-job'

位于

config('custom.public.pagelevel.js.add-job')

中，在default.blade.php中它指向css：

config('custom.public.pagelevel.css.'.$action)

。如果我理解正确，那么只需更改路径...