# grunt-replaceholder

> Used for replacing placeholder content with template tags.

Latest version **0.0.3** (published 2017-01-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install grunt-replaceholder
pnpm add grunt-replaceholder
yarn add grunt-replaceholder
bun add grunt-replaceholder
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.3 |
| Published | 2017-01-03 |
| First published | 2015-09-16 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >= 0.8.0 |
| Dependencies | 1 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Michael Parks |
| Maintainers | artparks |
| Keywords | gruntplugin |

## Links

- npm: https://www.npmjs.com/package/grunt-replaceholder
- Repository: https://github.com/artparks/replaceholder
- Homepage: https://github.com/artparks/replaceholder#readme
- Issues: https://github.com/artparks/replaceholder/issues
- npm.io page: https://npm.io/package/grunt-replaceholder

## Dependencies (1)

- [cheerio](https://npm.io/package/cheerio.md) ^0.19.0

## Recent versions

- 0.0.3 (latest) — 2017-01-03
- 0.0.1 — 2015-09-16

## README

# Replaceholder

> Used for replacing placeholder content with template tags.

This plugin was built for helping to create custom themes for Zendesk and is used for replacing placeholder content with the template tags that generate that content in production.

Take this sample markup that could be a file `topics.html`:

    <h2>List of topics</h2>
    <ul data-replaceholder="{{list_topics}}">
        <li>Just some dummy data</li>
        <li>Here to help us build the template.</li>
        <li>This whole <ul> element</li>
        <li>Will actually be output by the CMS</li>
        <li>Via the template tag {{list_topics}}</li>
    </ul>

So you would work on the above dummy markup to build your template and then run this Grunt plugin over your template files to replace any elements with a `data-replaceholder` attribute with the corresponding template tag that should actually be there.

### Using a templates file
If you wish to replace with something more simple than just a {{handlebars}} style template tag (for example something that iterates over an array and then outputs each item), then you can put this template code into a separate file, to stop the `data-replaceholder=""` becoming unworkably huge.

Specify the location of the template JSON file with the grunt option `templates`. This JSON file is then an object keyed by the template names you refer to in `data-replaceholder`. For example:

    <ul data-replaceholder="template:foobar">
        <li>Iteration one</li>
        <li>Iteration two</li>
    </ul>

And then in templates.json:

    {
        "foobar": "<ul>{{#each posts}}<li>{{post.name}}: {{post.author}}</li>{{/each}}</ul>"
    }

## Getting Started
This plugin requires Grunt.

If you haven't used [Grunt](http://gruntjs.com/) before, be sure to check out the [Getting Started](http://gruntjs.com/getting-started) guide, as it explains how to create a [Gruntfile](http://gruntjs.com/sample-gruntfile) as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

    npm install grunt-replaceholder --save-dev

Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:

    grunt.loadNpmTasks('grunt-replaceholder');

## The "replaceholder" task

### Usage
In your project's Gruntfile, add a section named `replaceholder` to the data object passed into `grunt.initConfig()`.

    grunt.initConfig({
      replaceholder: {
        options: {
          dataAttribute: 'replaceholder',
          templates: false // or a string with a path to a templates JSON file
        },
        target: {
          files: 'path/to/destination' : 'path/to/source/**/*.html'
        },
      },
    })

## Release History
v0.0.1 - Built it. No tests, #lol.

## License
Copyright (c) 2015 Michael Parks. Licensed under the MIT license.

---
_Source: https://npm.io/package/grunt-replaceholder · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._