Global dependencies

A global dependency is any stylesheet, javascript library or module that your web application must have in every page to work accordingly. For example: jQuery, Semantic-UI, Bootstrap, etc.

How to create and publish a global dependency? #

Let's say we need to create and publish a global dependency to the Bootstrap Stylesheet. First we need to create the spec file by issuing the following command:

        
            elemental-cms global-deps --dep bootstrap text/css
        
    

This will create a file at [your-global-dependencies-folder]/text_css/bootstrap.json with the following content:

        
            {
                "_id": {
                    "$oid": "619ffd59431a16f6e906f393"
                },
                "order": -1,
                "name": "bootstrap",
                "type": "text/css",
                "url": "",
                "meta": {},
                "createdAt": {
                    "$date": 1637875033623
                },
                "lastModifiedAt": {
                    "$date": 1637875033623
                }
            }
        
    

Then we edit the spec file and add the url to the actual stylesheet; and we can also add meta data to it so the final file content will be something like this:

        
            {
                "_id": {
                    "$oid": "619ffd59431a16f6e906f393"
                },
                "order": -1,
                "name": "bootstrap",
                "type": "text/css",
                "url": "https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css",
                "meta": {
                  "integrity": "sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3",
                  "crossorigin": "anonymous"
                },
                "createdAt": {
                    "$date": 1637875033623
                },
                "lastModifiedAt": {
                    "$date": 1637875033623
                }
            }
        
    

Finally in order to make this global dependency available in every page we issue the push command as shown below:

        
            elemental-cms global-deps push --dep bootstrap text/css
        
    

Or we can also push all global dependencies by using the --all option, like this:

        
            elemental-cms global-deps push --all
        
    

Backup spec file

If the global dependency already exists a backup file will be created and stored at [your-global-dependencies-folder]/text_css/.bak/bootstrap-[epoch-creation-time].json

Content