Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

请问下支持代码段导入吗? #14

Open
winyh opened this issue Sep 17, 2020 · 2 comments · May be fixed by #45
Open

请问下支持代码段导入吗? #14

winyh opened this issue Sep 17, 2020 · 2 comments · May be fixed by #45

Comments

@winyh
Copy link

winyh commented Sep 17, 2020

::: demo

<<< @/filepath

:::

========================>

上面的 @/filepath 文件内容就是下面的。是否能够支持我在 markdown 文件外写好示例,用代码块的方式导入到markdown文件,渲染出效果的同时将源代码展示出来,目前测试好像不支持,下面的方式可以正常显示。上面的不行

::: demo

<template>
  <div class="box-vue">Vue {{ message }}</div>
  <a-button @click="handle" type="primary">winyh</a-button>
</template>
<script>
  export default {
    data: () => ({ message: "Hello World" }),
    methods: {
      handle(e) {
        console.log(e.target.nodeName);
      },
    },
  };
</script>
<style>
  .box-vue {
    color: red;
  }
</style>

:::

@winyh
Copy link
Author

winyh commented Sep 28, 2020

::: demo

<<< @/filepath

:::

========================>

上面的 @/filepath 文件内容就是下面的。是否能够支持我在 markdown 文件外写好示例,用代码块的方式导入到markdown文件,渲染出效果的同时将源代码展示出来,目前测试好像不支持,下面的方式可以正常显示。上面的不行

::: demo

<template>
  <div class="box-vue">Vue {{ message }}</div>
  <a-button @click="handle" type="primary">winyh</a-button>
</template>
<script>
  export default {
    data: () => ({ message: "Hello World" }),
    methods: {
      handle(e) {
        console.log(e.target.nodeName);
      },
    },
  };
</script>
<style>
  .box-vue {
    color: red;
  }
</style>

:::

改了一下,可以满足块导入了
⬇️⬇️⬇️⬇️⬇️⬇️

:::demo
<<< @/examples/ButtonExample/index.vue
:::

const fs = require("fs")

const filepath = tokens[idx + 1].type === 'fence' ? tokens[idx + 1].src : '';
const source = fs.readFileSync(filepath).toString();

@k644606347
Copy link

k644606347 commented Dec 28, 2021

::: demo

<<< @/filepath

:::
========================>
上面的 @/filepath 文件内容就是下面的。是否能够支持我在 markdown 文件外写好示例,用代码块的方式导入到markdown文件,渲染出效果的同时将源代码展示出来,目前测试好像不支持,下面的方式可以正常显示。上面的不行
::: demo

<template>
  <div class="box-vue">Vue {{ message }}</div>
  <a-button @click="handle" type="primary">winyh</a-button>
</template>
<script>
  export default {
    data: () => ({ message: "Hello World" }),
    methods: {
      handle(e) {
        console.log(e.target.nodeName);
      },
    },
  };
</script>
<style>
  .box-vue {
    color: red;
  }
</style>

:::

改了一下,可以满足块导入了 ⬇️⬇️⬇️⬇️⬇️⬇️

:::demo <<< @/examples/ButtonExample/index.vue :::

const fs = require("fs")

const filepath = tokens[idx + 1].type === 'fence' ? tokens[idx + 1].src : ''; const source = fs.readFileSync(filepath).toString();

求教具体该怎么改造?@winyh

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
2 participants