Docs Wvm Template Directives Load

Template directive: Load 2.0+

This directive is used to import static files after it has been previously defined with unique names in the resource handler classes Res and Ress. Once the unique name of a url or resource group is defined through the named(), bindTo() or bind() method, the resource can later be imported through the @load() directive. The top level resource file res/res.php may contain static url declarations resembling the format below:
res/res.php
  <?php
  
  Res::url('file1.css')->named('f1-css') //declare url with unique group name  
      ->url('file2.css')->named('f2-css') //declare url with unique group name  
      ->url('file1.js')->named('f1-js')   //declare url with unique group name  
      ->url('file2.js')->named('f2-js')   //declare url with unique group name  

      ->bind('f1-scripts', ['f1-css','f1-js'])//bind groups to new unique group name  
      ->bind('f2-scripts', ['f2-css','f2-js'])//bind groups to new unique group name
Since this file is acessible across the web application, it is easier to load the url scripts through their assigned unique names. The sample below shows how the @load() directive can be applied to import specific url scripts.
sample.rex.php
  <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Sample</title>
      @load('f1-css')
  </head>
  <body>
      
  </body>
  </html>
It is important to know that the @load() directive works for both the Res and the Ress classes depending on the class which is pre-configured to be used. Also, the @import() directive can be combined together with the @load() directive in such a way that the former is used to extend to an external resource file while the latter is used to import the unique names from the extended file. A sample of this is shown below:
themes/design.php
  <?php
  
  Ress::url('file1.css')->named('f1-css') //declare url with unique group name  
      ->url('file2.css')->named('f2-css') //declare url with unique group name  
      ->url('file1.js')->named('f1-js')   //declare url with unique group name  
      ->url('file2.js')->named('f2-js');  //declare url with unique group name
The sample above represents an local design file. This file can be imported and accessed within template files as shown below: 
  <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Sample</title>
      @import('themes.design')
      @load('f1-css')
  </head>
  <body>
      
  </body>
  </html>
From the sample above, the @import() is used to extend to the resource file while the @load() is used to import a url's relative script to the template file. We suggest to visit the the documentation on import directive for more information about the @import() directive.

Docs Wvm Template Directives Load