webpack基本使用与介绍
1. js 依赖(引用)css 依赖(引用)jpg
与Gulp Grunt相比对了模块打包的概念(没有html)
webpack只能直接加载和打包js 和json文件,要加载css,必须利用一个loader(webpack 1.0只能加载js webpack 3增添加载json )
2.webpack3内部支持ES6 commandJS AMD三种模块语法 webpack1.0 ES6
只要打包主模块 主模块可以引入其它模块 会在打包后的js模块中体现出来
第一种:打包js json模块
可以用webpack.js打包文件
补充:url-loader是对象file-loader的上层封装,使用时需配合file-loader使用。
可以将小于8KB的图片以based64的编码形式打包到js文件(based64编码:将图片转化为字符串,打包到js,减少页面一次发图片请求)
css-Loader只负责加载css文件,而把这个文件应用到当前页面需要style-Loader.
打包大8KB的图片的时候
把index文件放到当前文件夹下
插件:先引入模块const 再配置 数组
第一个插件的作用:以某个模板自动生成目录资源文件夹底下的index.html
第二个插件:把资源目录全部底下全部删除,然后重新打包生成