Markdown-it-import
An extensible Markdown-it plugin to import external files.
Attension: To be compatible with VuePress v2, markdown-it-import is now released as pure ESM packages.
Features
Currently, it supports the following files
- Markdown files: Similar to
#include
of C language, the nested import is supported. - Code snippets
What's more, transclusion is also supported, like lines, fragement tags and regular expression.
Usage
npm i vuepress@next markdown-it-import -S
configure your config.js
import markdownItImport from 'markdown-it-import'
export default {
extendsMarkdown: (md) => {
md.use(markdownItImport);
}
}
Example
Using @import(type, importPath, optional)
in your markdown files, just like you call javascript function.
type
:string
path
:string
others
: Javascript Object
Import Markdown
Exclusive options:
recursive
:bool
, whether to import recursively, default totrue
Import markdown files without recursion.
@import('md', './test/simple-md-import.md', {recursive: false})
This is a simple markdown file, and it will import another markdown file.
The imported content is as follows:
@import('md', './imported.md')
Import markdown files recursively.
@import('md', './test/simple-md-import.md')
This is a simple markdown file, and it will import another markdown file.
The imported content is as follows:
This is what will be imported.
This is what will be imported.
Import code
Exclusive options:
lang
:string
, the type of the language, default to the extension of file name.
@import('code', './test/helloworld.js', {lang: 'js'})
console.log('Hello World')
Using the transclusion parameter
Options of transclusion (in order of precedence):
lines
:Array
, the line number you want to importfragement
:string
, the lines betweenfragement
will be importedregex
:Regex
, the lines match theregex
will be imported
The entire content of ./test/lines.txt
is as follows
line 1
# tag1
line 3
line 4
# tag1
line 6
# tag2
line 8
line 9
line 10
line 11
line 12
line 13
line 14
line 15
line 16
line 17
# tag2
line 19
line 20
line 21
Import lines 3 to 8
@import('code', './test/lines.text', {lang: 'text', lines: [3, 8]})
line 3
line 4
# tag1
line 6
# tag2
line 8
Import lines 1, 3 to 5, and 8
@import('code', './test/lines.text', {lang: 'text', lines: [1, [3, 5], 8]})
line 1
line 3
line 4
# tag1
line 8
Import the content between # tag1
@import('code', './test/lines.text', {lang: 'text', fragment: '# tag1'})
line 3
line 4
Using regular expression to import lines 10 to 19
@import('code', './test/lines.text', {lang: 'text', regex: /line\s1[0-9]/})
line 10
line 11
line 12
line 13
line 14
line 15
line 16
line 17
line 19
Complex transclusion
@import('code', './test/lines.text', {lang: 'text', line: [6, 20], fragment: '# tag2', regex: /line\s[0-9]$/})
line 8
line 9