webpack基础入门(三)

了解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


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值