webpack中处理第三方loader的过程

webpack 默认只能打包处理JS类型的文件，无法处理其他的非JS类型的文件，如果处理非JS的文件，我们需要手动安装一些适合第三方 loader加载器；
1.如果想要打包处理 css 文件，需要手动安装
npm i style-loader css-loader -D
2.如果想要打包处理less文件，需要手动安装
npm i style-loader less-loader -D
3如果想要打包处理scss文件，需要手动安装
npm i style-loader sass-loader -D
4,如果先要打包处理图片的文件，需要手动安装
npm i file-loader url-loader -D
然后再mian.js文件中导入

接着打开webpack.config.js 这个配置文件，在里面新增一个配置节点，叫做module,它是一个对象；在这个module对象身上，有一个rules属性，这个rules属性是一个数组，这个数组中存放了所有第三方文件的匹配和处理规则

注意：webpack 处理第三方文件类型的过程：
1.发现这个要处理的文件不是JS文件，然后根据配置文件中查找有没有对应的第三方loader规则
2.如果能找到对应的规则，就会调用对应的loader处理这个文件类型；
3.在调用loader的时候，是从后往前调用的
4.当最后一个loader处理完毕，会把处理的结果直接交给webpack进行打包合并，最终输出到bundle.js中去。