Swamp Things – Jesse Planck

Have fun!

Drupal 8 – Composer: updating, module installs, & external library support notes

by

in

This is a set of configuration steps used to setup the requirements for the Tulane Library website using Drupal. PHP-Composer with Bower and NPM integration is used for updating and installing Drupal core, modules, and libraries. Included are procedures, configurations, and websites with information.

Prerequisites – May be necessary on the composer system used for installation and updates.

  1. Use npm to install bower for package management on system. In this case it is installed globally with by using the -g option. If npm is not installed you will need to install that first, so use your operating system specific procedures to install npm.
    npm install -g bower

All command-line commands noted below should be run from the Drupal root folder where the site is downloaded to in the step #1.

  1. Downloaded initially prepared Drupal website with git. This site has been prepared by Campus IT and uses a Git repository. Website code is committed to the repository labeled as “/dev” where it will be uploaded to libdev8.tulane.edu
  2. Update composer.json file to support bower and npm as additional css and javascript package managers.

    Under in the repositories section, add asset-packagist.org as an additional repository.
    Look for “repositories” and add (commas as needed): { “type”: “composer”, “url”: “https://asset-packagist.org”> }
  3. Update site to current available Drupal version using composer. Use following commands:
    composer update drupal/core –with-dependencies
    drush updatedb
    – if Drush is working otherwise look at /update.php
    drush cache:rebuild
    – if Drush is working otherwise look in admin configuration > performance.
  4. Install Drupal modules needed for development and production work:

    composer –update-with-dependencies require ‘drupal/ctools’
    Activated: Chaos Tools
    composer –update-with-dependencies require ‘drupal/rabbit_hole’
    Activated: Rabbit Hole, Rabbit hole nodes, rabbit hole taxonomy
    composer –update-with-dependencies require ‘drupal/ds’
    Activated: Display Suite, Display Suite Extras, Display Suite switch views.
    composer –update-with-dependencies require ‘drupal/field_group’
    Activate: Field Groups module
    composer –update-with-dependencies require ‘drupal/token’
    Activate: token module
    composer –update-with-dependencies require ‘drupal/redirect’
    Activate: redirect module
    composer –update-with-dependencies require ‘drupal/entity_reference_revisions’
    Activate: Entity Reference Revisions module
    composer –update-with-dependencies require ‘drupal/autogrow’
    Activate: Autogrow module
    composer –update-with-dependencies require ‘drupal/metatag’
    Activate: Metatag module
    composer –update-with-dependencies require ‘drupal/imce’
    Activate: IMCE File Manager module
    composer –update-with-dependencies require ‘drupal/simplesamlphp_auth’
    Activate: SimpleSAMLphp Authentication module.
    composer –update-with-dependencies require ‘drupal/seckit’
    Activate: Security Kit module
    composer –update-with-dependencies require ‘drupal/securelogin’
    Activate: Secure Login module
    composer –update-with-dependencies require ‘drupal/antibot’
    Activate: Antibot module
    composer –update-with-dependencies require ‘drupal/honeypot’
    Activate: Honeypot module
    composer –update-with-dependencies require ‘drupal/webform’
    Activate Webform module
    composer –update-with-dependencies require ‘drupal/pathauto’
    Activate: Pathauto module
    composer –update-with-dependencies require ‘drupal/diff’
    Activate Diff module
    composer –update-with-dependencies require ‘drupal/slick’
    Activate: Slick and Slick UI modules. You must enable the Blazy, Media modules to install Slick.
    composer –update-with-dependencies require ‘drupal/auto_entitylabel’
  5. Installing external libraries with Composer as written about at:
    https://www.drupal.org/docs/8/modules/webform/webform-frequently-asked-questions/how-to-use-composer-to-install-libraries
    – This should help eliminate the warnings: Webform: External libraries and lay foundation for external libraries into drupal-root: /libraries. External libraries are needed for the Webform and Slick Carousel modules.
  6. From drupal root directory in terminal use:
    composer require wikimedia/composer-merge-plugin
    – installs the composer merge plugin to install separate libraries.
    – (untested!) May no longer be necessary after executing step #2.
    If you install these plugins, you may need to add the following to the composer.json file:
    Look for “config” and add:
    “fxp-asset”: { “installer-paths”: { “npm-asset-library”: “libraries”, “bower-asset-library”: “libraries” } }
  7. It may also be necessary to have the installer extender composer plugin installed:
    composer global require oomphinc/composer-installers-extender
  8. Edit Drupal root composer.json file to support npm and bower assets:
    Look for “extra”, add:
    – Added options may need commas for syntax.
    “installer-types”: [ “bower-asset”, “npm-asset” ],
    – Adds bower and npm support.

    “merge-plugin”: {
                “include”: [
                    “modules/contrib/webform/composer.libraries.json”
                ]
            },
    – informs composer to look in referenced composer.libraries.json file for installs.

    Look for “installer-paths” and confirm these additions or changes.
    “installer-paths”: { “core”: [“type:drupal-core”], “libraries/slick”: [ “bower-asset/slick-carousel”, “npm-asset/slick-carousel” ], “libraries/{$name}”: [ “type:drupal-library”, “type:bower-asset” ]
    – Add /library folder location. You may need to create this location drupal-root:/libraries
  9. From terminal in drupal root:
    composer update –lock
    – update lock, usually finishes install

    Follow up install checks:
    composer update –with-dependencies
    – to perform full updates

Helpful info: https://www.drupal.org/project/slick/issues/2855190
More notes: https://www.drupal.org/project/lightning/issues/3014759
Troubleshoot composer bower integration: https://www.drupal.org/project/lightning/issues/3014759
Composer & Bower integration, path configurations: https://www.drupal.org/project/slick/issues/2907371#comment-12882235
Slick Carousel requirements with bower integration notes – has set of command-line commands.: https://git.drupalcode.org/project/slick/blob/8.x-1.x/README.md
Installing External libraries requited by a Drupal module: https://www.drupal.org/docs/7/modules/libraries-api/installing-an-external-library-that-is-required-by-a-contributed-module
Helpful information about Composer and Bower integration including npm, bower, composer installations: https://gist.github.com/macagua/d85f8790dba9c0ad2745926937b2d240

Install slick libraries with bowser integration.

This is an example to install the slick-carousel library using composer with bower integration.

composer require bower-asset/slick-carousel

To install specific versions use:

composer require bower-asset/slick-carousel:dev-master
— Note: some external javascript requited use of dev-master versions.
— It will be necessary to update the drupal-root:/composer.json file, and you should also check the required areas.

To check versions of installed packages with composer use:
composer show

Github – create token to download slick assets. From command-line output of above. Can also be regenerated at github.com.

Installing Recommended Drupal Core updates with Composer
composer update drupal/core-recommended –with-dependencies