Defining and referring reusable components in Docify

Components can be used to define reusable files. Components can contain any files.

When the component is referenced into the site its content is copied to the site content into the root folder and its files behave correspondingly. For example, if component contains the file in the _include folder, this file will be considered as include.

Defining the component structure below

_components
    comp1
        _includes
            my-include.cshtml
        _assets
            logo.png
            styles
                style.png

And referring it in the site below

_include
    site-include.cshtml
_assets
    main.png
    styles
        main.css
    scripts
        main.js
_config.yml

Would result in the following content to be compiled

_include
    site-include.cshtml
    my-include.cshtml
_assets
    main.png
    logo.png
    styles
        main.css
        style.png
    scripts
        main.js
_config.yml

Components are loaded from the library when

• Library is referenced with --lib argument of build or serve command
• Component is referenced in the _config.yml file

components:
  - comp1

Different components must have unique file names compared to different components or files in the site, otherwise, the conflict error will be thrown. This is a main difference between components and themes as themes are designed to support files overriding.

For example, referring following two components in the site will generate an error as _assets\logo.png file is used in both comp1 and comp2:

_components
    comp1
        _includes
            my-include.cshtml
        _assets
            logo.png
    comp2
        _includes
            my-include2.cshtml
        _assets
            logo.png

Components are usually used to create reusable includes with supporting files (such as images, styles and scripts which include needs to consume).

Refer the standard library components section for an example of components.