Composer / bower integration? Configurable paths?

Rather than modifying the module, it might be worthwhile to configure composer to install/update into the correct directory.

Include this at the bottom of your composer.json -

  "scripts": {
    "post-install-cmd": [
      "php -r \"shell_exec('mv docroot/sites/all/libraries/slick-carousel docroot/sites/all/libraries/slick');\""
    ],
    "pre-update-cmd": [
      "php -r \"shell_exec('rm -rf docroot/sites/all/libraries/slick');\""
    ],
    "post-update-cmd": [
      "php -r \"shell_exec('mv docroot/sites/all/libraries/slick-carousel docroot/sites/all/libraries/slick');\""
    ]
  }

There is already a commit for 8.x that uses the slick-carousel path. See issue: #2855190: Using bower or composer to download the slick library is cumbersome.

Thanks for the catch.

It seems we have a few issues to address:

• slick_requirements()
  This appears to be an obvious miss from my end when I committed the fix here:
  https://www.drupal.org/node/2855190#comment-11987678

  We can commit this part.

• slick_library_info_alter()

  -    $library_path = libraries_get_path('slick') ? libraries_get_path('slick') : libraries_get_path('slick-carousel');
  +    $library_path = libraries_get_path('slick-carousel') ? libraries_get_path('slick-carousel') : libraries_get_path('slick-carousel');

  The deleted line was already correct. The new one was repeating the same thing 'slick-carousel'.
  This issue was addressed as mentioned above #12261678. Thanks.

  Also Drupal always puts site builders first over DX, IMHO. So this is actually not an issue as long as correctly put.
  This cannot be in. CMMIW.

• slick.libraries.yml
  The easing library can follow the above-mentioned line:
  $easing_path = libraries_get_path('easing') ? libraries_get_path('easing') : libraries_get_path('jquery.easing');
  This may need work. No need to touch slick.libraries.yml, let's just do it at slick_library_info_alter().

Shall we change library path aggressively from "slick" to "slick-carousel"?

The library namespace is "slick". Not "slick-carousel".

And remains "slick" when bower was added, too.

And this module was created with the same namespace as original author's namespace, too.

My own two cents would be to still accommodate "slick" namespace like this:
$library_path = libraries_get_path('slick') ? libraries_get_path('slick') : libraries_get_path('slick-carousel');

You are happy. The original intention is still respected, too.

What you changed was perhaps just a typo as it appears to repeat libraries_get_path('slick-carousel'):
+ $library_path = libraries_get_path('slick-carousel') ? libraries_get_path('slick-carousel') : libraries_get_path('slick-carousel');

This is not as hard as changing religion, however let's hear for more suggestions ;)

I use Drupal VM and Composer's create-project as a site deployment strategy.
This composer.json code delivers the Slick library to the right place (in my case).

     "repositories": [
    {
            "type": "package",
            "package": {
                "name": "kenwheeler/slick",
                "version": "master",
                "type": "drupal-library",
                "dist": {
                    "url": "https://github.com/kenwheeler/slick/archive/master.zip",
                    "type": "zip"
                }
            }
        }
  ],
  "extra": {
        "installer-paths": {
            "web/libraries/{$name}": ["type:drupal-library"]
        }
    },
  "require": {
    "kenwheeler/slick": "*"
  }

#8 works fine for me. The only additional step (using thunder-8.4.3) is to rename
thunder/docroot/libraries/slick-carousel
to
thunder/docroot/libraries/slick

#7 Slick-carousel bower uses slick-carousel as a name, slick on bower and npm is a different library. I say slick should follow the standard in bower.

#8 We shouldn't have to add this to composer.json because it does not support versioning. If older versions exist they get thrown out to the wind.

Hello

@gausarts as the module maintainer what do you recomend? I have to use Composer in my project. Thanks :)

Besides slick library, shouldn't jquery.easing be installed with Composer too?

Of late, I have been creating symlinks for libraries whose names differ in the module from that in other JS repositories. This can be handled by Composer. You just need to add it as a post-install command.

This works if you are installing the libraries for the first time. If the libraries already exist, you only need to run the command manually once.
I have found this to be the easiest solution that will work without needing modifications to the module code.

"scripts": {
  "post-install-cmd": [
    "ln -f -s jquery.easing ./web/sites/all/libraries/easing",
    "ln -f -s slick-carousel ./web/sites/all/libraries/slick"
  ]
}

Here is my complete composer.json file -

{
  "repositories": {
    "drupal": {
      "type": "composer",
      "url": "https://packages.drupal.org/7"
    },
    "npm-asset": {
      "type": "composer",
      "url": "https://asset-packagist.org"
    },
  },
  "require": {
    "hirak/prestissimo": "^0.3",
    "composer/installers": "^1.2",
    "oomphinc/composer-installers-extender": "^1.1",
    "drupal/drupal": "~7.0",
    "drupal/jquery_update": "^2.7",
    "drupal/libraries": "^2.3",
    "drupal/slick": "2.x-dev",
    "drupal/slick_views": "2.x-dev",
    "npm-asset/jquery": "^1.8",
    "npm-asset/jquery.easing": "^1.4",
    "npm-asset/slick-carousel": "^1.7",
  },
  "conflict": {
      "drupal/core": "8.*"
  },
  "minimum-stability": "dev",
  "prefer-stable": true,
  "extra": {
    "installer-types": [
      "npm-asset"
    ],
    "installer-paths": {
      "web/sites/all/libraries/{$name}": [
        "type:drupal-library",
        "type:npm-asset"
      ],
      "web/sites/all/modules/contrib/{$name}": ["type:drupal-module"]
    },
  },
  "scripts": {
    "post-install-cmd": [
      "ln -f -s jquery.easing ./web/sites/all/libraries/easing",
      "ln -f -s slick-carousel ./web/sites/all/libraries/slick"
    ]
  }
}

Fwiw, here's an alternative for dependency handling that seems more consistent (thanks in part to Vardot supporting blazy and slick composer packages, and gymadarasz supporting the jQuery.easing package):

composer require drupal/blazy drupal/libraries drupal/slick gymadarasz/jquery.easing vardot/blazy vardot/slick

Is it sufficient, or do others see something more that is needed? (naturally it will be best to handle dependencies in the composer.json vs doing it manually).

I think when using composer to install the library, a better solution to changing the paths than using a post-install command is to use the installer-paths configuration.

You can change the path of individual libraries, in addition to setting rules by type. Composer will apply the first matching rule, so the individual package paths need to be specified before the rule for the package type.

For asset-packagist:

    "repositories": {
         "asset-packagist": {
             "type": "composer",
             "url": "https://asset-packagist.org"
        }
    }
    "require": {
        "npm-asset/slick-carousel": "^1.8"
    },
    "extra": {
        "installer-paths": {
            "docroot/libraries/slick": ["npm-asset/slick-carousel"],
            "docroot/libraries/{$name}": [
                "type:drupal-library",
                "type:bower-asset",
                 "type:npm-asset"
            ]
        }
    }

Seems there are several very different proposals. Anyone able to compare them and help settle on a 'supported' approach? If so, I'm happy to help get the recommendation into docs.

I tried #15 but I can't get it to work.
It just gets installed in vendor/npm-asset/slick-carousel.
I've read at getcomposer faq that to use installer-paths, the package needs to have a type and should require 'composer/installers'.
After installing npm-asset/slick-carousel, you can see in your composer.lock that it does have a type of 'npm-asset' but no requirement for 'composer/installers' hence it goes to vendor.
To fix this, you need 'oomphinc/composer-installers-extender' and add "installer-types": ["npm-asset"] to the extra bit.
More at asset-packagist

My working set-up are as follows:

"repositories": [
        {
            "type": "composer",
            "url": "https://packages.drupal.org/8"
        },
        {
            "type": "composer",
            "url": "https://asset-packagist.org"
        }
],
"require": {
        "npm-asset/slick-carousel": "^1.8",
        "oomphinc/composer-installers-extender": "^1.1",
},
"extra": {
        "installer-types": ["npm-asset", "bower-asset"],
        "installer-paths": {
            "web/libraries/slick": ["npm-asset/slick-carousel"],
            "web/libraries/{$name}": ["type:drupal-library", "type:npm-asset", "type:bower-asset"]
        }
}

@bryancs It doesn't work for you because packages declared in the require field are in the wrong order. Packages from asset packagist can only be installed in the appropriate folder if you declare them after the Composer Installer Extender package.

Change your require to

"require": {
        "oomphinc/composer-installers-extender": "^1.1",
        "npm-asset/slick-carousel": "^1.8"
},

FWIW, #15 is the approach that I now use. It is better than the symlink method that I mentioned in #13

@teknikqa sorry I should've made it clear.
The setup I posted is actually the one that's working.
My concern with #15 is that for packages that doesn't include "composer/installers", one can use "oomphinc/composer-installers-extender" and add the appropriate "installer-types" (and installer-paths) on the extra block.
Yes, I agree with you on using #15 rather than symlink.

FYI: Below only addresses the composer workflow part, not the issue about configurable paths, yet.

Another alternative to install assets with Composer:
https://github.com/fxpio/composer-asset-plugin?
https://github.com/fxpio/composer-asset-plugin/blob/master/Resources/doc...

Requires defining the install paths under config directive:
https://github.com/fxpio/composer-asset-plugin/blob/master/Resources/doc...

{
    "config": {
        "fxp-asset": {
            "installer-paths": {
                "npm-asset-library": "web/libraries",
                "bower-asset-library": "web/libraries"
            }
        }
    }
}

A few things to note:

• Must be installed globally:
  $ composer global require "fxp/composer-asset-plugin:~1.3"
• No post command with symlinks, nor moving files. Defining paths to libraries within "config" directive like the above-mentioned is required.
• No more touching composer.json once the paths defined, just do regular composer require .... for initial setups, e.g.:
  

  $ composer require bower-asset/blazy \
  bower-asset/slick-carousel:^1.8 \
  bower-asset/jquery-mousewheel \
  bower-asset/jquery.easing \
  drupal/blazy \
  drupal/slick

Thoughts, or any issue I am not aware of?

Attempts to address the paths.
FYI:

• jquery easing puts its library within `js` directory via Composer adding extra lines.
• Requires libraries.module.

If any improvement, please post your patches.
I am willing to get this in before the next release. Thanks.

Let's get the ball rolling.
Feel free to re-open if any improvement, or flaw found. Thanks!

Thanks!

Committed. Thank you for contribution!

The suggested command

$ composer require bower-asset/blazy \
bower-asset/slick-carousel:^1.8 \
bower-asset/jquery-mousewheel \
bower-asset/jquery.easing \
drupal/blazy \
drupal/slick

To download the libraries didn't work for me, as I got the following error:

Problem 1
    - drupal/slick 1.1.0 requires drupal/blazy ~1.0 -> satisfiable by drupal/blazy[1.x-dev, 1.0.0-rc4, 1.0.0-rc3, 1.0.0-rc2, 1.0.0-rc1, 1.0.0-beta6, 1.0.0-beta5, 1.0.0-beta4, 1.0.0-beta3, 1.0.0-beta2, 1.0.0-beta1, 1.0.0-alpha5, 1.0.0-alpha4, 1.0.0-alpha3, 1.0.0-alpha2, 1.0.0-alpha1] but these conflict with your requirements or minimum-stability.
    - drupal/slick 1.1.0 requires drupal/blazy ~1.0 -> satisfiable by drupal/blazy[1.x-dev, 1.0.0-rc4, 1.0.0-rc3, 1.0.0-rc2, 1.0.0-rc1, 1.0.0-beta6, 1.0.0-beta5, 1.0.0-beta4, 1.0.0-beta3, 1.0.0-beta2, 1.0.0-beta1, 1.0.0-alpha5, 1.0.0-alpha4, 1.0.0-alpha3, 1.0.0-alpha2, 1.0.0-alpha1] but these conflict with your requirements or minimum-stability.
    - drupal/slick 1.x-dev requires drupal/blazy ~1.0 -> satisfiable by drupal/blazy[1.x-dev, 1.0.0-rc4, 1.0.0-rc3, 1.0.0-rc2, 1.0.0-rc1, 1.0.0-beta6, 1.0.0-beta5, 1.0.0-beta4, 1.0.0-beta3, 1.0.0-beta2, 1.0.0-beta1, 1.0.0-alpha5, 1.0.0-alpha4, 1.0.0-alpha3, 1.0.0-alpha2, 1.0.0-alpha1] but these conflict with your requirements or minimum-stability.
    - drupal/slick 1.1.0 requires drupal/blazy ~1.0 -> satisfiable by drupal/blazy[1.x-dev, 1.0.0-rc4, 1.0.0-rc3, 1.0.0-rc2, 1.0.0-rc1, 1.0.0-beta6, 1.0.0-beta5, 1.0.0-beta4, 1.0.0-beta3, 1.0.0-beta2, 1.0.0-beta1, 1.0.0-alpha5, 1.0.0-alpha4, 1.0.0-alpha3, 1.0.0-alpha2, 1.0.0-alpha1] but these conflict with your requirements or minimum-stability.
    - Installation request for drupal/slick ^1.1 -> satisfiable by drupal/slick[1.x-dev, 1.1.0].

as composer tried to download the "^2.0@RC" version "for drupal/blazy"

composer require bower-asset/blazy \
bower-asset/slick-carousel:^1.8 \
bower-asset/jquery-mousewheel \
bower-asset/jquery.easing \
drupal/blazy:~1.0 \
drupal/slick

was the way to make it work.

I am getting the following error using #34 above:

[InvalidArgumentException]
Could not find package bower-asset/blazy.

Did you mean this?
drupal/photoswipe

I am using with the following workingconfig

Following is the part of the composer config relevant

"repositories": [
    {
      "type": "composer",
      "url": "https://packages.drupal.org/8"
    },
    {
        "type": "composer",
        "url": "https://asset-packagist.org"
    },
    {
      "type": "package",
      "package": {
        "name": "slick/slick",
        "version": "v1.8.1",
        "type": "drupal-library",
        "dist": {
          "url": "https://github.com/kenwheeler/slick/archive/master.zip",
          "type": "zip"
        }
      }
    }
  ],
    "require": {
    "bower-asset/blazy": "^1.8",
    "bower-asset/jquery-mousewheel": "^3.1",
    "bower-asset/jquery.easing": "^1.3",
    "slick/slick": "^1.8",
    ....
   ....
}
....
"extra": {
      "web/libraries/{$name}": [
        "type:drupal-library",
        "type:bower-asset",
        "type:npm-asset",
        "vendor:npm-asset",
        "vendor:bower-asset"
      ]
.....
}

My composer command is then

composer require bower-asset/blazy \
slick/slick \
bower-asset/jquery-mousewheel \
bower-asset/jquery.easing \
drupal/blazy:~1.0 \
drupal/slick

I added slick seperately to avoid renaming it.

@zuhair_ak, I am testing out Drupal 9 and trying to figure out Composer. How do I apply the configuration in #36? I am guessing I append these lines to the existing composer.json in the project root. If I have already installed the Slick and Blazy contributed modules, do I need to install them, install the preq-reqs, and then reinstall Slick/Blazy?

It looks like the packages are installed to the /web/libraries directory, rather than the /vendor directory where I see other packages being installed by Composer. I assume this is for consistency with the slick.libraries.yml in /modules/contrib/slick.

Does the Drupal Libraries API module need to be installed? It looks like Drupal 8 migration of this module is still in progress.

Thanks, Norbert

@nhoeller You have to make changes in the composer.json in the project root. Composer is for managing PHP libraries, there are javavscript library in the list (for eg. slick/slick), that is why we are adding it in the "repositories". If already installed,composer will skip the installed packages.

I think for Drupal 9 as far as I can see from the Readme file, libraries module is not needed.

@zuhair_ak Thanks for the fast response! I freely admit that I am playing catch-up.

Regards, Norbert

@zuhair_ak I think I figured out the updates to composer.json. It took a while to get commas in the right place - a JSON viewer saved the day.

I ran individual "composer require ...' commands, starting with "bower-asset/blazy" which downloaded slick/slick and the four bower-asset packages. I skipped the drupal/blazy and drupal/slick because I had already installed them, and I need Blazy 2.x or higher for my version of the Drupal Slick module.

I see the slick v1.8.1 library installed to web/libraries/slick/slick. However, the other libraries (blazy 1.8.2, jquery 3.5.1, jquery-mousewheel 3.1.13, and jquery.easing 1.3.1) were all loaded to vendor/bower-asset. The Drupal 9 status report indicates Drupal found the slick library but not the blazy library.

It looks like the slick/slick library is associated with "type": "drupal-library" - I found an associated "installer-paths": that referenced "web/libraries/($name)". Should the code you showed below "extra": have been added below "installer-paths": ?

Thanks, Norbert

@zuhair_ak thank you for your suggestion. Using asset-packagist.org is definitely the right way how to fix this issue.

Here's link to official documentation. @nhoeller, there you can see that your code need to be added below "installer-paths"

Current fix for this issue use fxp/composer-asset-plugin that need to be installed globally. Here's is some issues from asset-packagist.org regarding this:

Got tired of fxp/composer-asset-plugin.

It's a good project with nice idea and good implementation. But it has some issues: it slows down composer update a lot and requires global installation, so affects all projects. Also there are Travis and Scrutinizer integration special problems, that are a bit annoying.

mhm i'm trying to install everything i need with composer, but when i run:

composer require bower-asset/blazy bower-asset/slick-carousel:^1.8 bower-asset/jquery-mousewheel bower-asset/jquery.easing drupal/blazy:~1.0 drupal/slick

i get:

 [InvalidArgumentException]                 
  Could not find package bower-asset/blazy.  
                                             
  Did you mean this?                         
      drupal/photoswipe

has the bower-asset/blazy package been moved somewhere else?

@joey-santiago, just modify what you run into composer to use blazy 2.

composer require bower-asset/blazy slick/slick bower-asset/jquery-mousewheel bower-asset/jquery.easing drupal/blazy drupal/slick

I also was encountering drupal/photoswipe (in #42) at first which not what wanted. #41 did it for me. Also #26 & 27 from this issue helped a lot: https://www.drupal.org/project/slick/issues/2855190#comment-13824992. After putting that all together, I was then able to run #43 on this issue and all was installed via composer, including the slick-carousel and blazy libraries I needed.

I did the installation today on a Drupal 9.2.0-beta3 and the code in 43 fails at the slick/slick part

After adding the asset-packagist repository and the installer types and paths and oomphinc/composer-installers-extender as explained at #26 and #27 here i used the following code:

composer require bower-asset/blazy bower-asset/slick-carousel bower-asset/jquery-mousewheel bower-asset/jquery.easing drupal/blazy drupal/slick

And this worked without errors.

I've noticed a couple of modules (webform and dropzonejs) starting to use composer.library.json with the wikimedia/composer-merge-plugin package.

This would allow for the module to dictate what is needed instead of requiring us to try and add everything.

#46 +1