open-index/open-npm huggingface dataset:
npm package: @hhm1999/vue-markdown-loader
Description: markdown file to vue component loader.
Latest version: 1.1.2

### 用途
`@hhm1999/vue-markdown-loader`是一个能让`markdown`格式文档中的`vue`示例代码运行起来的`loader`。

### 安装
```
npm i @hhm1999/vue-markdown-loader --save-dev
```

### webpack配置

```javascript
module.exports = {
  module: {
    rules: [
      {
        test: /\.md$/,
        use: [
          { loader: 'vue-loader' },
          {
            loader: '@hhm1999/vue-markdown-loader',
            options: {demoContainerComponentName: 'mdDemoContainerComponent'}
          }
        ]
      }
    ]
  }
}
```

### vue cli配置

```javascript
module.exports = {
  chainWebpack: config => {
    config.module
      .rule('markdown')
      .test(/\.md$/)
      .use('vue-loader')
      .loader('vue-loader')
      .end()
      .use('vue-markdown-loader')
      .loader('@hhm1999/vue-markdown-loader')
      .options({
        demoContainerComponentName: 'mdDemoContainerComponent'
      })
      .end()
  }
}

```

### Options

#### demoContainerComponentName
用来包裹`示例代码`及`示例代码运行结果`的组件名，该组件必须有`component`和`code`两个`slot`，分别用来放置`示例代码`及`示例代码运行结果`。

### 原理
原理请参考文章：[让Markdown中的Vue代码运行起来](https://segmentfault.com/a/1190000039137759)
npm package: @hhm1999/x-components
Description: 基于Vue的组件库
Latest version: 0.6.44

#### x-components是一个基于vue的组件库

##### 安装
```
npm i @hhm1999/x-components --save
```

##### 详见：[中文文档](https://hhm1999.github.io/x-components/)