feat(vant-markdown-loader): rEADME 中引入 demo 组件时支持设置 playground 属性

packages/vant-markdown-loader/src/index.js

@@ -1,24 +1,20 @@
 const path = require('path');
 const loaderUtils = require('loader-utils');
-const MarkdownIt = require('markdown-it');
-const markdownItAnchor = require('markdown-it-anchor');
 const frontMatter = require('front-matter');
-const highlight = require('./highlight');
+const parser = require('./md-parser');
 const linkOpen = require('./link-open');
 const cardWrapper = require('./card-wrapper');
 const extractDemo = require('./extract-demo');
 const sideEffectTags = require('./side-effect-tags');
-const { slugify } = require('transliteration');
 
 function camelize(str) {
   return str.replace(/-(\w)/g, (_, c) => (c ? c.toUpperCase() : ''));
 }
 
 function wrapper(content) {
-  const markdownDir = path.dirname(this.resourcePath);
   let demoLinks;
   let styles;
-  [content, demoLinks] = extractDemo(content);
+  [content, demoLinks] = extractDemo.call(this, content);
   [content, styles] = sideEffectTags(content);
   content = cardWrapper(content);
   return `
@@ -31,9 +27,7 @@ function wrapper(content) {
 <script>
 ${demoLinks
   .map((link) => {
-    const absPath = path.join(markdownDir, link); // 获取 demo 文件的完整路径
-    const demoFileName = path.basename(link, '.vue');
-    return `import ${camelize(demoFileName)} from '${absPath}';`;
+    return `import ${camelize(path.basename(link, '.vue'))} from '${link}';`;
   })
   .join('\n')}
 
@@ -67,14 +61,6 @@ ${styles.join('\n')}
 `;
 }
 
-const parser = new MarkdownIt({
-  html: true,
-  highlight,
-}).use(markdownItAnchor, {
-  level: 2,
-  slugify,
-});
-
 module.exports = function (source) {
   let options = loaderUtils.getOptions(this) || {};
   this.cacheable && this.cacheable();