markdown-loader的创建步骤创建package.json 直接在终端输入npm init -y,即可创建pa

创建package.json

直接在终端输入npm init -y,即可创建package.json；
在script里面输入 "build": "webpack --config webpack.config.js"
npm run build时，则会运行此文件；
"devDependencies"里面则是安装的能用到的文件的安装版本；

创建webpakage.config.js

const path = require ('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
    resolveLoader: {
        modules:['node_modules','loaders']
    },
    entry: {
        index:'./src/js/index.js'
    },
    module:{
        rules:[
            {
				test: /\.md$/,
				use: [
				{
					loader: 'html-loader'
				},
				{
					loader: 'markdown-loader',
					options: {
                        html:true
                    }
				}],
			},
			{
				test: /\.css$/,
				use: [
					'style-loader',
					'css-loader'
				]
			}

        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            filename:'index.html',
            template:'./src/views/index.html',
            title:'haha'
        })
    ]
}

在src创建文件

在views文件夹里创建一个index.html模板

<!DOCTYPE html>
<html>
<head>
	<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
	<h1>test</h1>
	<%= require('./article.md') %>

</body>
</html>

在views文件夹里创建article.md文件；markdown文件，方便后期转换

# 测试
## 希望这次成功吧
<p>这是一个段落</p>
···