# vue-markdown-demo

> #### 安装 ``` npm install vue-markdown-demo ```

Latest version **0.1.0** (published 2020-05-06) · 0 weekly downloads

## Install

```sh
npm install vue-markdown-demo
pnpm add vue-markdown-demo
yarn add vue-markdown-demo
bun add vue-markdown-demo
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.0 |
| Published | 2020-05-06 |
| First published | 2020-05-06 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 8 |
| Unpacked size | 5.5 MB |
| Known vulnerabilities | 0 (+27 in 3 direct dependencies) |
| Install scripts | no |
| Maintainers | chenxiaobin |

## Links

- npm: https://www.npmjs.com/package/vue-markdown-demo
- npm.io page: https://npm.io/package/vue-markdown-demo

## Dependencies (8)

- [vue](https://npm.io/package/vue.md) ^2.6.11
- [axios](https://npm.io/package/axios.md) ^0.19.2
- [moment](https://npm.io/package/moment.md) ^2.24.0
- [core-js](https://npm.io/package/core-js.md) ^3.6.4
- [node-sass](https://npm.io/package/node-sass.md) ^4.13.1
- [sass-loader](https://npm.io/package/sass-loader.md) ^8.0.2
- [vue-codemirror](https://npm.io/package/vue-codemirror.md) ^4.0.6
- [vue-markdown-run](https://npm.io/package/vue-markdown-run.md) ^1.1.41

## Recent versions

- 0.1.0 (latest) — 2020-05-06

## README

### vue-markdown-demo

#### 安装
```
npm install vue-markdown-demo
```

#### 属性


参数  | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
code  | vue示例代码，单文件组件          | string |
scope | 单文件组件中，从外部import的组件 | object |


#### 示例

[demo](https://chenxiaobin.github.io/vue-markdown-docs/lib/index.html#/)

##### 需要展示的代码 `code.vue`
```
<template>
  <div>{{msg}}</div>
</template>
<script>
export default {
  data () {
    return {
      msg: '测试'
    }
  },
  mounted () {
    this.msg = moment().format('YYYY-MM-DD HH:mm:ss')
  }
}
</script>
<style></style>
```

##### 示例代码
```
<template>
  <div class="test">
    <markdown-docs :code="code" :scope="scope"></markdown-docs>
  </div>
</template>
<script>
import axios from 'axios'
import markdownDocs from '../components/index'

import moment from 'moment'
export default {
  data () {
    return {
      code: '',
      scope: {
        moment
      }
    }
  },
  components: {
    markdownDocs
  },
  mounted () {
    this.getCode()
  },
  methods: {
    getCode () {
      let url = './code.vue'
      axios.get(url).then((result) => {
        this.code = result.data
      })
    }
  }
}
</script>
<style>
.test{
  width: 100%;
  height: 100%;
}
</style>
```

![](https://raw.githubusercontent.com/chenxiaobin/vue-markdown-docs/master/public/images/test.jpg)

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