## 介绍

这是一个markdown文件解析加渲染一体的功能，可以很好的适应Typora的主题模板

## 下载

```shell
npm i markdown-typora
```

## 使用

以vue3为例：

```js
//模块引入
import {markdownToHTML, hljs} from 'markdown-typora'
import md from '@/article/1.md?raw'
import {onMounted} from 'vue'

onMounted(() => {
  const write = document.querySelector('#write')
  write.innerHTML = markdownToHTML(md)
// 代码高亮调用函数
  hljs.highlightAll()
})
```

此时md文件被转为了html，但是没有css样式，可以自己找css样式，推荐的网站：[Themes Gallery — Typora](https://theme.typora.io/)，也可以使用我为你准备的，放在源代码的dist/styles中，直接复制里面的内容，自己新建一个css文件即可，比如：`src/assets/css/md_theme.css`，然后再main.js中引入即可：

```js
import '@/assets/css/md_theme.css'
```



## 引入库

1. markdown-it
2. highlight.js

## ts版本
可以查看[https://www.npmjs.com/package/markdown-typora-ts](https://www.npmjs.com/package/markdown-typora-ts)