PHPackages                             heimrichhannot/contao-stylesheet-manager-bundle - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. heimrichhannot/contao-stylesheet-manager-bundle

AbandonedArchivedContao-module

heimrichhannot/contao-stylesheet-manager-bundle
===============================================

This module offers functionality for generating an aggregated CSS file out of different types of stylesheets in Contao (preserving access to mixins and variables from nearly every file).

3.2.4(6y ago)0371LGPL-3.0+PHPPHP >=5.5.0

Since Jun 20Pushed 6y ago2 watchersCompare

[ Source](https://github.com/heimrichhannot/contao-stylesheet-manager-bundle)[ Packagist](https://packagist.org/packages/heimrichhannot/contao-stylesheet-manager-bundle)[ Docs](https://bitbucket.com/heimrichhannot/contao-stylesheet-manager-bundle)[ RSS](/packages/heimrichhannot-contao-stylesheet-manager-bundle/feed)WikiDiscussions master Synced 3d ago

READMEChangelog (2)Dependencies (2)Versions (24)Used By (0)

Contao Stylesheet Manager
=========================

[](#contao-stylesheet-manager)

This module offers functionality for generating an aggregated CSS file out of different types of stylesheets in Contao (preserving access to mixins and variables from nearly every file).

Features
--------

[](#features)

- expandable architecture (new preprocessors like LESS can be added easily)
- SCSS
    - uses locally installed sass for compiling SCSS files (usually `/usr/bin/env sass`)
- aggregating all files to a single CSS file
- support for development and production environment (including css map in dev environment and minification aka compression in production environment)
- caching of the generated CSS file so that a full regeneration is only necessary if at least one of the linked files change
- recursive watching for changes of all imported scss files
- a random string is added to the name of the generated css file to bypass browser cache

Possible types of stylesheets
-----------------------------

[](#possible-types-of-stylesheets)

Note: the order of types is mandatory.

Stylesheet typeDescriptionSupported formatsOverridable stylesheetscore stylesheetse.g. bootstrapCSS, SCSS–module stylesheetsstylesheets living in contao modules, i.e. assets/cssCSS (else contao would throw Exception)coreproject stylesheetsproject specific stylesheetsCSS, SCSScore, modulesNote: Even though project stylesheets are loaded *after* everything else, there's still access to all stylesheets (including variables, mixins, ... living in the core stylesheets).

Currently supported formats
---------------------------

[](#currently-supported-formats)

Note: This module is written in an expandable way, so new compilers can be added easily (e.g. LESS).

- CSS
- SCSS (compiled by sass which is a requirement then)

Technical instructions
----------------------

[](#technical-instructions)

### Installation

[](#installation)

1. Add the following code to a config.php of one of your modules (preferably some kind of module containing all the business logic of your project):

    ```
    $GLOBALS['TL_STYLESHEET_MANAGER_CSS'] = [
        'domain1' => [
            'core'    => [
                'files/themes/domain1/scss/_variables.scss', // add the project's variables in order to override variables of libs like bootstrap
                'files/themes/domain1/scss/_core.scss' // could import libs like bootstrap or font awesome
            ],
            'project' => [
                'files/themes/domain2/scss/project.scss' // could import other scss files which are also watched by default
            ],
            'skipModuleCss' => false // set to true if this domain doesn't need module CSS
        ],
        'domain2' => [
            'core'    => [
                'files/themes/domain2/scss/_variables.scss', // add the project's variables in order to override variables of libs like bootstrap
                'files/themes/domain2/scss/_core.scss' // could import libs like bootstrap or font awesome
            ],
            'project' => [
                'files/themes/domain2/scss/project.scss' // could import other scss files which are also watched by default
            ],
            'skipModuleCss' => false // set to true if this domain doesn't need module CSS
        ]
    ];

    ```

    **Important note**: Every file can import other files. These files are also watched for changes. If you don't want that (e.g. due to performance issues), you can disable this feature by setting `$GLOBALS['STYLESHEET_MANAGER']['preprocessors']['scss']['recursivelyWatchImports'] = false`.
2. Copy the contao template fe\_page.html5 to your contao instance's templates directory and replace `` by `\` (CAUTION: including the comment characters! Adjust the name after the dot according to your domain name in `$GLOBALS['TL_STYLESHEET_MANAGER_CSS']`).

### Configuration

[](#configuration)

Note: Take a look into `config.php` in order to see what properties can be adjusted.

### Commands

[](#commands)

- clear the stylesheet manager cache: `/vendor/bin/contao-console stylesheetmanager:cache:clear`

### CSS generation and caching

[](#css-generation-and-caching)

[![CSS generation and caching](docs/css-generation.png)](docs/css-generation.png)

### Add a new preprocessor

[](#add-a-new-preprocessor)

1. Extend from Compiler (copy Scss.php if you like):

    ```