Search code examples
assemble

How to get markdown working in Assemble?

I'm setting up assemble in grunt. It's a little difficult because the devs seem to have changed a lot about the installation process, but there's no updated documentation.

Does anyone know how to set up markdown processing?

I've tried a few things - I found a post that mentioned installing handlebars-helper-md so I tried that.

My assemble task looks like this:

assemble: {
    options: {
        layout: 'page.hbs',
        layoutdir: './src/content/layouts',
        partials: ['./src/content/partials/**/*.hbs', './src/content/partials/**/*.md'],
        assets: 'assets',
        helpers: ['handlebars-helper-md'],
        data: ['package.json', './src/content/data/*.json'],
        marked: {
            breaks: false,
            gfm: true,
            langPrefix: 'language-',
            pedantic: false,
            sanitize: false,
            silent: false,
            smartLists: false,
            smartypants: false,
            tables: true
        }
    },
    project: {
        files: [{
            cwd: './src/content/pages',
            dest: './dist/www',
            expand: true,
            src: ['**/*.hbs']
        }]
    }
},

then I've put markdown files into these places (none of which work):

  1. ./src/content/markdown/privacy.md
  2. ./src/content/partials/privacy.md
  3. Directly in the template

my template is located in ./src/content/pages/content/privacy-policy.hbs and looks like this:

title: Privacy
description: The privacy policy
tags:
- content
- legal
text: ./markdown/privacy.md
---
<div class="row">
    <div class="col s12">
        <p>This is a quick test for the privacy policy content</p>

        <div style="border: 1px solid black">
            Test 1:
            {{md './markdown/privacy.md'}}

            relative to the hbs file perhaps?
            {{md '../../markdown/privacy.md'}}

        </div>
        <div style="border: 1px solid black">
            Test 2:
            {{>privacy}}

        </div>
        <div style="border: 1px solid black">
            Test3:

            {{md text}}

        </div>
        <div style="border: 1px solid black">
            Test4:
            {{#markdown}}
                ## Hello World
            {{/markdown}}

        </div>
    </div>
</div>



            smartLists: false,
            smartypants: false,
            tables: true
        }
    },
    project: {
        files: [{
            cwd: './src/content/pages',
            dest: './dist/www',
            expand: true,
            src: ['**/*.hbs']
        }]
    }
},

Then, basically two methods kind of work - but the markdown isn't processed. This is a picture of the output:

enter image description here

Solution

  • handlebars-helper-markdown is still designed to work with grunt-assemble and it looks for partials that have been registered with the partials option in the task configuration.

    You just need to add ./src/content/markdown/*.md to your partials array, then use {{md "privacy"}} for the helper to find the privacy.md file to render.

    I notice you have privacy.md in 2 places. In grunt-assemble this will result in only the last privacy.md partial being loaded. FYI in case you run into that issue. We'll be refactoring the grunt-assemble internals soon to match up to functionality in [email protected] to handle situations like this.