Laravel View X-Ray


July 20th, 2018


Laravel View X-Ray is a package for Laravel 5.6 by Marcel Pociot which enables you to peek into your Laravel views and find out which template matches a specific part of the HTML output.

After installing the package it’s enabled by default in development, and then you can hit Cmd + Shift + X (Ctrl + Shift + X on Windows). Note, at the time of writing the View X-Ray package depends on jQuery.

Example of the Laravel View X-Ray Package

The result is a beautiful visual representation of your view, and it’s easy to understand the view hierarchy at a glance now with X-Ray enabled. You can hide the X-Ray UI by hitting the shortcut again or pressing the esc key.

You can disable X-Ray and exclude views with the following configuration options:

3return [
5 /*
6 * Determines if the Xray package should be enabled.
7 */
8 'enabled' => env('XRAY_ENABLED', true),
10 /*
11 * If you want to exclude certain views from being processed by Xray,
12 * you can list them here. Be aware that the check only applies to the
13 * root views that you add here. If these views include other views
14 * themselves, they need to be excluded manually.
15 */
16 'excluded' => [
17 //
18 ],

Learn More

You can install Laravel X-Ray in your Laravel 5.6 applications with the following composer command:

1composer require beyondcode/laravel-view-xray --dev

You can learn more by visiting the GitHub repo at beyondcode/laravel-view-xray. Another excellent package by Marcel Pociot, be sure to thank him for his dedication to the Laravel ecosystem!

Filed in:

Paul Redmond

Full stack web developer. Author of Lumen Programming Guide and Docker for PHP Developers.