webpack实现常用loader

实现常用loader

概念：什么是loader？

webpack只能处理javascript的模块，如果要处理其他类型的文件，需要使用loader进行转换，loader是webpack中的一个重要概念
，它是指用来将一段代码转换成为另一段代码的webpack加载器

loader基本配置：

let path = require('path');
module.exports = {
    entry: './index.js',
    output: {
        filename: 'index.js',
        path: require('path'),
    },
    mode: 'development',
    resolveLoader: {
        modules: ['node_module', path.resolve(__diname, 'loaders')],
        alias: {
            loader1: path.resolve(__diname, 'loaders', 'loader1.js'),
        }
    },
    module: {
        rules: [ 
            {
                test: /\.js$/,
                // 使用resolveLoader后可简写
                // use: path.resolve(__dirname, 'loader', 'loader1.js'),
                use: 'loader1',
            }
        ]
    }
}

配置多个loader：