Blade templates support

Inject JavaScript or CSS into a Blade template section automatically

PhpStorm can automatically inject code into Blade template sections based on the defined injection rules. Out of the box, the rules for automatically injecting JavaScript and CSS code are available.

• In a Blade template, add a section named javascript (to inject JavaScript) or css (to inject CSS) as follows:

  @section('javascript') // injected JavaScript code @stop @section('css') // injected CSS code @stop

  PhpStorm will automatically inject JavaScript or CSS into the template sections.

  

Enable Blade debugging

1. In the Settings dialog (Ctrl+Alt+S) , go to PHP | Debug | Templates and expand the Blade Debug area.

2. In the Cache path field, provide the absolute path to the Blade compiled templates cache folder. Type the path manually or click and select the relevant folder in the dialog that opens. By default, compiled Blade templates are stored in the storage/framework/views/ folder inside your project.

Start a debugging session

Start a debugging session as described in the Ultimate debugging guide. The easiest and recommended approach is to use Zero-configuration debugging:

1. Choose and install the browser extension suitable for your browser.

2. On the PhpStorm toolbar, toggle to start listening for incoming PHP debug connections, or choose Run | Start Listening for PHP Debug Connections from the main menu.

3. Set a breakpoint in your code.

4. Start the debugging session in the browser using the installed browser extension.

5. During a debugging session, examine the program state: see variable values, evaluate expressions, step through the program, and so on.

Add, modify, or remove Blade directives

Blade directives are managed on the Directives tab of the Blade Page. The tab lists all the currently available Blade directives, for those that have parameters, the prefixes and suffixes are also shown. When you start, the list contains only predefined directives. You can edit these directives as well as create custom ones.

1. In the Settings dialog (Ctrl+Alt+S) , go to PHP | Blade.

2. On the Blade page that opens, switch to the Directives tab, which shows a list of all currently available directives.

   

   • To define a new directive, click and specify the directive's name in the Name field.

     If the new directives requires a prefix and a suffix, select the Has parameter checkbox and type the prefix and suffix to use in the Prefix and Suffix fields respectively. PhpStorm will automatically enclose the prefix and suffix in opening and closing brackets and quotes and add a colon separator : so the parameters will look as follows: ("<prefix>:<suffix>").

   • To edit an existing directive, select it in the list and change the values in the fields below.

     To restore the original definition, click .

   • To remove a directive from the list, select it and click .

Configure Blade delimiters

PhpStorm recognizes Blade templates and provides error highlighting and code completion for them based on the delimiters you specify.

1. In the Settings dialog (Ctrl+Alt+S) , go to PHP | Blade.

2. On the Blade page that opens, switch to the Text Tags. The fields in the tab show the opening and closing characters for raw tags, content tags, and escaped tags.

3. The fields are filled in with the default values in compliance with Blade Templates 5.8. If you are using an earlier version, you can specify the relevant custom delimiters and PhpStorm will provide coding assistance according to the new rules.