Skip to content

Commit

Permalink
init
Browse files Browse the repository at this point in the history
  • Loading branch information
fabioaanthony committed Feb 26, 2019
0 parents commit 3b5088f
Show file tree
Hide file tree
Showing 10 changed files with 479 additions and 0 deletions.
6 changes: 6 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
.DS_Store
node_modules
*.log
.temp
TODOs.md
.vscode
129 changes: 129 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,129 @@
# Markdown-it Vuepress Code Snippet Enhanced


## Why use this plugin?

- Specify your own language :boom:
- Transclude any part of a file :boom:
- Line highlighting extended from Vuepress :green_heart:

<br />

## Install

```sh
npm i -D markdown-it-vuepress-code-snippet-enhanced
```

---
<br />

## Setup

In Vuepress `config.js` add the following:

```js
markdown: {
config: md => {
md.use(require('markdown-it-vuepress-code-snippet-enhanced'))
}
}
```

You can now import code snippets into your markdown files with the following syntax:

```md
@[code](@/docs/code.js)
@[code lang=ruby transclude={1-1}](@/docs/code.rb)
@[code highlight={1-6} transcludeTag=style](@/docs/code.vue)
@[code highlight={4,9,11-16} transcludeWith=:::](@/docs/code.vue)
```



## Options

### Language
You can specify any language for syntax highlighting as follows:
```md
@[code lang=ruby](@/docs/code.rb)
@[code lang=csharp](@/docs/code.cs)
```
_Vuepress uses prismjs, so for proper syntax highlighting check prism.js docs._

<br/>

### Transclusion
You can transclude a single or multiple parts of a file using `transclude`, `transcludeWith`, or `transcludeTag`.

#### transcludeWith
For transcluding one or more parts of a file using comment lines and specify a unique pattern.
```md
@[code lang=ruby transcludeWith=|_|_|](@/docs/code.rb)
@[code transcludeWith=:::](@/docs/code.js)
@[code transcludeWith=++++](@/docs/code.h)
```
##### Example
```rb
require 'lib'
require 'other'

# |_|_|
def hello
puts 'hello'
puts 'vue'
end
# |_|_|
```

#### transcludeTag
Useful when working `Vue` single file components.
```md
@[code transcludeTag=template](@/docs/code.vue)
@[code transcludeTag=script](@/docs/code.vue)
@[code transcludeTag=style](@/docs/code.vue)
```

#### transclude
Use a range indicating the `start` and `end` lines. This option is inclusive.
```md
@[code transclude={5-13}](@/docs/code.js)
```


## Sample

### Input Markdown
```
@[code highlight={1-6} transcludeTag=style](@/docs/code.vue)
```

### Source File
```html
<template>
<div class="component"></div>
</template>

<script>
export default {
mounted () {
alert('yay!')
}
}
</script>

<style lang="scss" scoped>
.component {
display: flex;
}
</style>
```
### Rendered Output

```css
<style lang="scss" scoped>
.component {
display: flex;
}
</style>
```
14 changes: 14 additions & 0 deletions example.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
module.exports = function autolink(state, silent) {
var tail, linkMatch, emailMatch, url, fullUrl, token,
pos = state.pos;

if (state.src.charCodeAt(pos) !== 0x3C /* < */ ) {
return false;
}

tail = state.src.slice(pos);

if (tail.indexOf('>') < 0) {
return false;
}
}
3 changes: 3 additions & 0 deletions index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
const codeSnippet = require('./src/plugin')

module.exports = codeSnippet
124 changes: 124 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

17 changes: 17 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
{
"name": "markdown-it-import",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "node index.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "Fabio Anselmo <[email protected]>",
"license": "MIT",
"devDependencies": {
"markdown-it": "^8.4.2",
"markdown-it-prism": "^2.0.1"
}
}
Loading

0 comments on commit 3b5088f

Please sign in to comment.