How to prepare development settings and configurations for Drupal development
Here we are discussing about how we can set up our local development system for fast development using Drupal. This configurations are applicable for both version 8 and 9.
we can classify steps as below.
- Configurations in settings.local.php
- Configurations in development.services.yml for enabling debug and for disable cache
- Debug using kint
- Setting up Drush in Development system
Configurations in settings.local.php
From sites folder copy example.settings.local.php and place it in /site/default folder.
C:\xampp\htdocs\drupal9\sites\example.settings.local.php -> C:\xampp\htdocs\drupal9\sites\default
Rename file to settings.local.php
In file default/settings.php you can see below code
if (file_exists($app_root . '/' . $site_path . '/settings.local.php')) { include $app_root . '/' . $site_path . '/settings.local.php'; }
By default this is disabled. Enable this one.
* Typical uses of settings.local.php include:
* – Disabling caching.
* – Disabling JavaScript/CSS compression.
* – Rerouting outgoing emails.
Avoid clearing cache for all updates in CSS and java script.
To enable css and js aggregation make below lines to true in settings.local.php
$config[‘system.performance’][‘css’][‘preprocess’] = TRUE;
$config[‘system.performance’][‘js’][‘preprocess’] = TRUE;
To disable cache render, uncomment below code in the settings.local.php
$settings[‘cache’][‘bins’][‘render’] = ‘cache.backend.null’;
To disable dynamic page cache, uncomment below code in the settings.local.php
$settings[‘cache’][‘bins’][‘dynamic_page_cache’] = ‘cache.backend.null’;
To disable internal page cache, in the settings.local.php, uncomment this below code:
$settings[‘cache’][‘bins’][‘page’] = ‘cache.backend.null’;
This file can be used to override variables on secondary (staging, * development, etc.) installations of this site.
Configurations in development.services.yml for enabling debug and for disable cache
Copy content of /sites/default/default.services.yml in to /sites/development.services.yml
Open this file and change the values under twig.config . this will disable twig cache.
twig.config:
debug: true
cache: false
auto_reload: true
Login to admin and clear the cache.
Now refresh the page and right click inspect element in Chrome web browser you can see twig debug section in html.
This will provide information about from which templates page is rendering.
Debug using kint
In older Drupal 8 versions Drupal kint module was available with Devel. Now in latest Drupal 8 and Drupal 9 versions, after installing Devel module, we need to enable kint library.
First install Devel using below composer command
$ composer require drupal/devel
Install kint as s dependency using below command
$ composer require kint-php/kint
After enabling Devel module, click on Devel settings as shown below.`
Select kint as variable dumper option.
Clear the cache and see for each node you can see Devel tab where you can see all details of the variables and properties rendered.
Please note in Drupal 8 older versions you have to enable Drupal Kint module. You have to use below function to print variables in templates.
{{ kint(content) }}
Setting up Drush in Development system.
During development , major chunk of time we have to spend on clearing Drupal cache. This will be time consuming when we are doing through browser. In order to reduce this time you can install Drush in your development system and use drush command for clearing cache.Below provided steps followed in windows system.
Install composer and run below composer statement to install drush
composer global require drush/drush:10.*
here I am installing Drush version 10 , because Drupal 9 supports only drush 10.
You can install Drush 7 and 8 versions as provided below.
composer global require drush/drush:7.*
composer global require drush/drush:8.*
You can see Drush compatibility with Drupal versions here https://www.drush.org/latest/install/#drupal-compatibility
Next add drush command to system path so that you can use drush command from anywhere in the system.
See below steps in windows in order to add drush to system path.
- Open the Control Panel
- Click “System”
- Click “Advanced system settings”
- Click “Environment Variables”
- In the “User variables” section click “New”
- Variable name: “Path”
- Variable value: “C:/Users/Modules/AppData/Roaming/Composer/vendor/drush/drush” (Replace “Modules” with your user name)
- Click “OK”
Now during development, clearing Drupal cache will be very easy by executing any one of the below command from command line.
drush cache-rebuild
or
drush cr
or
drush rebuild