marked-essay-loader

marked-essay-loader 是 dl-pages 项目内部集成的一个 markdown 类型的文件加载器 其核心模块是使用了 marked 和 highlight.js 模块

Work In Webpack

marked-essay-loader 最终返回的是一个 html 模块，所以还需要使用 html-loader 编译处理

module: {
    rules: [
        // 其他规则
        {
            test: /\.md$/,
            use: [
                'html-loader',
                'marked-essay-loader'
            ]
        }
        // 其他规则
    ]
}

Styles

marked-essay-loader 不仅使用了 highlight.js 美化代码块的内容，还提供了一份样式文件。

marked-essay-loader 修改了 marked 的配置项，并添加了自己的类名。 marked-essay-loader 的样式文件提供了 .less 和 .scss 两个格式的。

// 在项目构建工具的入口文件中直接引入
import 'marked-essay-loader/styles/marked-style.less'
// import 'marked-essay-loader/styles/marked-style.less'