webpack 五个核心配置项

  什么是配置项?

   在前面一章讲过webpack是一个构建工具,用来统一使用各种包。 配置项的作用就是告诉每个包应该怎样去工作。 比方说babel转码包, 需要设置对哪些文件进行转码,毕竟它自己可不知道哪些文件应该要转码。

 五个核心配置项

① entry  入口文件 指定哪个文件为入口文件

②output  指令 打包后的文件(也就是bundle)应该放在哪里

③loader   一般是用来翻译文件的,因为webpack只认识js文件,比如 入口文件引入了css文件,但是 webpack并不认识css文件,这时需要我们进行设置处理,让webpack能读懂css文件。

④plugins   英文就是插件,具有功能性的配置项, 比方对js文件进行压缩,优化等等处理

⑤mode  用来定义  生产环境或者开发环境。

以上内容基本上没有什么难读懂的, 但也有需要解释的地方, 生产环境 和开发环境。

开发环境:   在本地运行调式的环境

生产环境:让代码上线的环境。

打个比方 生产一辆车,那生产的过程称为开发环境,  车生产好了,也不能立马去卖,还需要对车进行检测,比方刹车有没有问题等等, 那这个过程叫做生产环境。

转换到代码中, 就是你编写代码在本地调试的环境叫开发环境, 代码写好了进行打包,打包后我们还需要对代码进行测试,那这个时候就是生产环境。

 以上就是webpack的五个核心配置,在接下来 的章节,我会讲解webpack具体的使用。  

  • 2
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值