webmdloader

WebMdLoader npm包说明

这是一个Markdown Loadr npm包，用于在加载md文件之时，解析md文件

使用方法

在webpack.config.js文件中写入

const path = require(`path`);
const HtmlWebpackPlugin = require('html-webpack-plugin');
const {CleanWebpackPlugin} =require('clean-webpack-plugin');

module.exports = {
    resolveLoader:{
        modules: ['node_modules', 'loaders']
    },
    entry: {
        index: './src/js/index.js'
    },
    module: {

        rules: [
			{
				test: /\.md$/,
				use: [
				{
					loader: 'html-loader',
                    options:{esModule: false}
				},
				{
					loader: 'webmdloader',
					options: {html:true}
				}],
			},
			{
				test: /\.css$/,
				use: [
					'style-loader',
					'css-loader'
				]
			}
		]
    },
    plugins: [
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin(
            {
                filename: 'index.html',
                title: 'Output Management',
                template: './src/views/index.html'
            }
        ),
    ],
    output: {
        filename: `[name].bundle.js`,
        path: path.resolve(__dirname, `dist`)
    }
};

实现思路

通过配置webpack.config.js，在加载md的时候，将其中的markdown语句传入loader中。loader中使用loader-utils插件获取配置参数，使用schema-utils检验配置参数格式。检验完成之后。使用markdown-it插件根据配置的参数，解析并返回数据。