Varbase Libraries

Drupal Libraries Management

The NPM/Yarn Method

List of needed libraries for Varbase Projects which uses packages with NPM/YARN.

NPM/Yarn dynamic way of managing packages as libraries.

By adding all needed libraries in "dependencies" and "drupal-libraries" in the package.json file in projects.

Available Drupal Libraries Sync Commands

Command	Description
yarn drupal-libraries-sync	Sync libraries using Yarn NPM/Yarn.
npm run drupal-libraries-sync	Sync libraries using.
composer drupal-libraries-sync	Sync libraries via Composer (uses Yarn by default).
composer drupal-libraries-yarn-sync	Sync libraries via Composer using Yarn.
composer drupal-libraries-npm-sync	Sync libraries via Composer using NPM.

Adding New Libraries

Search for packages in https://www.npmjs.com

1. Add to package.json Dependencies

{
  "dependencies": {
    "npm-package-to-start-using": "^1.0.0"
  }
}

2. Configure Library Mapping

Add the library mapping to the drupal-libraries section:

{
  "drupal-libraries": {
    "libraries": [
      { "name": "new-library", "package": "new-library" }
    ]
  }
}

3. Install and Sync

yarn install

The yarn install will do the equivalent of running yarn drupal-libraries-sync in the postinstall event, when the installation of packages in node_modules finishes.

Example:

1- Let us imagine that we need the chart.js npm library in a project, to be used with the Chart module along with the C3 and D3 npm libraries. (Search for packages in https://www.npmjs.com)

2- Add the following in "dependencies"

    "chart.js": "~4",
    "d3": "~5",
    "c3": "0.7.*",

3- Add the following in drupal-libraries.libraries

  {"name": "chartjs", "package": "chart.js"},
  {"name": "c3", "package": "c3"},
  {"name": "d3", "package": "d3"},

4- Run the following script to sync selected drupal libraries from node_module to docroot/libraries.

yarn install

5- Check that you do have the new libraries in your docroot/libraries folder.

6- Notice that the package chart.js was copied from node_modules and when the chartjs name, as the Chart module was developed to locate the chartjs folder in libraries.

Make sure that you commit the libraries with git. It is no longer ignored in the .gitignore file

For more examples have a look at "dependencies" and "drupal-libraries" in the package.json

Removing No Longer Needed Libraries

1. Remove from the package.json file.

Remove the library from both dependencies and drupal-libraries.libraries sections.

2. Clean Up Files

Remove the library directory from libraries

rm -rf docroot/libraries/used-npm-package

Troubleshooting

Libraries Not Appearing

1. Verify package.json syntax is valid

2. Check that the library mapping in drupal-libraries.libraries is correct

3. Ensure the sync script exists at ./docroot/profiles/contrib/varbase/scripts/drupal-libraries-sync.js

4. Run sync command manually: yarn drupal-libraries-sync

Permission Issues

Fix permissions if needed

chmod +x ./docroot/profiles/contrib/varbase/scripts/drupal-libraries-sync.js

Switch from Asset Packagist to NPM/Yarn

Migrating Existing Projects to NPM/YARN with drupal-libraries-syncThe Composer Method (Deprecated)