What is markdown-it-task-lists?
The markdown-it-task-lists package is a plugin for the markdown-it Markdown parser that allows you to create GitHub-style task lists. This plugin converts Markdown task list syntax into HTML checkboxes, making it easy to create interactive task lists in your Markdown documents.
What are markdown-it-task-lists's main functionalities?
Basic Task List
This feature allows you to create a basic task list with unchecked and checked items. The code sample demonstrates how to use the markdown-it-task-lists plugin to render a Markdown task list into HTML.
const md = require('markdown-it')();
const taskLists = require('markdown-it-task-lists');
md.use(taskLists);
const result = md.render('- [ ] Task 1\n- [x] Task 2');
console.log(result);
Customizable Task List
This feature allows you to customize the task list rendering. The code sample shows how to enable labels and configure their position using the plugin options.
const md = require('markdown-it')();
const taskLists = require('markdown-it-task-lists');
md.use(taskLists, { enabled: true, label: true, labelAfter: false });
const result = md.render('- [ ] Task 1\n- [x] Task 2');
console.log(result);
Other packages similar to markdown-it-task-lists
markdown-it-checkbox
The markdown-it-checkbox package is another markdown-it plugin that adds support for checkboxes in Markdown. It is similar to markdown-it-task-lists but focuses more on providing customizable checkbox elements rather than full task lists.
markdown-it-todo
The markdown-it-todo package is a plugin that adds support for todo lists in Markdown. It is similar to markdown-it-task-lists but offers additional features like custom styles and event handling for todo items.
markdown-it-task-lists
A markdown-it plugin to create GitHub-style task lists
What it does
- Builds task/todo lists out of markdown lists with items starting with
[ ]
or [x]
. - Nothing else
Why is this useful?
When you have markdown documentation with checklists, rendering HTML checkboxes
out of the list items looks nicer than the raw square brackets.
Installation
npm install markdown-it-task-lists
Usage
Use it the same as a normal markdown-it plugin:
var md = require('markdown-it');
var taskLists = require('markdown-it-task-lists');
var parser = md().use(taskLists);
var result = parser.render(...);
The rendered checkboxes are disabled; to change this, pass a truthy value into
the enabled
property of the plugin options:
var parser = md().use(taskLists, {enabled: true});
If you'd like to wrap the rendered list items in a <label>
element for UX
purposes, pass a truthy value to the label
property of the plugin options:
var parser = md().use(taskLists, {label: true});
To add the label after the checkbox pass a truthy value to labelAfter
property:
var parser = md().use(taskLists, {label: true, labelAfter: true});
Note: This option does require the label
option to be truthy.
The options can be combined, of course.
Browser Usage
If you use one of the versions of this module available in dist/
directly in
a browser by including it with a <script>
element, it will be available
globally in window.markdownitTaskLists
.
Tests
npm install
npm test
License
ISC