markdown-loader版本列表

下面是 markdown-loader 的版本列表：

- 1.0.0-alpha.3
- 1.0.0-alpha.2
- 1.0.0-alpha.1
- 0.5.0
- 0.4.2
- 0.4.1
- 0.4.0
- 0.3.0
- 0.2.1
- 0.2.0
- 0.1.0

请注意，这些版本可能已经过时或不再维护。建议使用最新版本的 markdown-loader。

相关问题

安装了vue-markdown-loader github-markdown-css后怎么引入

安装了`vue-markdown-loader`和`github-markdown-css`之后，在Vue项目中引入它们通常有以下步骤：

1. **安装依赖**：
使用npm或yarn添加这两个依赖：

   npm install --save-dev vue-loader vue-style-loader css-loader style-loader markdown-it marked github-markdown-css
   # 或者使用yarn
   yarn add -D vue-loader vue-style-loader css-loader style-loader markdown-it marked github-markdown-css

2. **配置webpack**：
在`vue.config.js`（对于Vue CLI 3.x及以上）或主项目的`webpack.config.js`中，添加对应的loader规则，以便处理`.md`文件。这里假设你已经配置了一个名为`vue`的loader：

   // vue.config.js (for Vue CLI 3.x)
   module.exports = {
     chainWebpack: config => {
       config.module
         .rule('md')
         .test(/\.md$/) // 匹配.md文件
         .use('vue-loader') // 使用vue-loader处理
         .tap(options => ({
           loader: 'vue-markdown-loader',
           options: {
             markdownItOptions: {
               html: true, // 允许html标签，适用于github-markdown-css
               use: ['@gfm/url', '@gfm/strikethrough'] // 添加支持的特性
             },
             highlight: true, // 启用代码高亮
             css: [
               path.resolve(__dirname, 'node_modules/github-markdown-css/css/github-markdown.css'), // 引入github-markdown-css
             ],
           }),
         }));
     },
   };

或者在单独的`markdown-loader.js`文件中配置：

   import MarkdownIt from 'markdown-it';
   import prism from 'prismjs';

   const mdLoader = {
     test: /\.md$/,
     use: [
       {
         loader: 'vue-loader',
         options: {
           loaders: {
             markdown: {
               loader: 'vue-markdown-loader',
               options: {
                 markdownIt: new MarkdownIt().use(prism),
                 // ...其他选项...
               },
             },
           },
         },
       },
     ],
   };

   export default mdLoader;

3. **引用组件**：
在需要使用`vue-markdown`的地方，直接引用即可：

   <template>
     <div>
       <vue-markdown :content="yourMarkdownContent"></vue-markdown>
     </div>
   </template>

完成上述步骤后，你应该能看到markdown文件的样式已经被github-markdown-css美化，包括代码块的样式了。

markdown-loader

Markdown-loader是一个用于Webpack构建工具的加载器（loader），用于处理Markdown文件。它可以将Markdown文件转换为HTML或其他格式，并将其作为模块导入到应用程序中。

使用markdown-loader，您可以在Webpack配置中将Markdown文件作为模块导入，然后使用该模块的内容在应用程序中渲染Markdown内容。这样可以方便地在应用程序中管理和展示Markdown文档。

例如，在Webpack配置中添加markdown-loader的规则：

module: {
  rules: [
    {
      test: /\.md$/,
      use: [
        'html-loader',  // 可选，用于处理Markdown中的HTML
        'markdown-loader',
      ],
    },
  ],
}

然后，您可以在应用程序中导入Markdown文件：

import markdownContent from './path/to/document.md';

// 使用markdownContent渲染Markdown内容

这样，您可以通过Webpack构建工具将Markdown文件转换为HTML，并在应用程序中使用。这对于构建文档网站或博客等场景非常有用。