了解webpack配置
webpack在执行的时候,除了在命令行传入参数,还可以通过制定的配置文件来执行,默认情况下,会搜索当前目录的webpack.config.js文件。这个文件是node.js模块,返回一个json格式的配置信息对象,或者通过 --config选项来执行配置文件。
现在仅仅需要运行webpack
了解webpack.config.js参数意义
entry:值入口文件的配置项,它是一个数组的原因是webpack允许多个入口点。当然如果你只有一个入口的话,也可以直接使用双引号“./entry.js”
output:配置打包结果,path定义了输出的文件夹,filename则定义了打包结果文件的名称
module:定义了对模板的处理逻辑,这里可以用loaders定义一系列的加载器,以及一些正则。当需要加载的文件匹配test的正则时,就会调用后面的loader对文件进行处理,这正是webpack强大的原因。
了解webpack插件
插件可以完成更多loader不能完成的功能,插件的使用一般是在webpack.config.js中的plugins选项中指定。
webpack本身内置了一些常用的插件,还可以通过npm安装第三方插件
来个最简单的插件,用来给输出的文件头部添加注释信息BannerPlugin的内置插件来实践插件的配置和运行
修改webpack.config.js添加plugins配置项
打开bundle.js