webpack 4 升级点：

  • 默认entry为./src,默认output为/dist
  • sideEffects
    在webapck2开始支持ESModule后，webpack提出了tree-shaking进行无用模块的消除，主要依赖ES Module的静态结构。在webapck4之前，主要通过在.babelrc文件中设置"modules": false来开启无用的模块检测，该方法显然比较粗暴。webapck4灵活扩展了如何对某模块开展无用代码检测，主要通过在package.json文件中设置sideEffects: false来告诉编译器该项目或模块是pure的，可以进行无用模块删除。
  • 废弃CommonsChunkPlugin
    webpack4废弃了CommonsChunkPlugin，引入了optimization.splitChunks和optimization.runtimeChunk，旨在优化chunk的拆分。
  • plugin
    内置optimization.minimize来压缩代码，不用再显示引入UglifyJsPlugin；
    废弃CommonsChunkPlugin插件，使用optimization.splitChunks和optimization.runtimeChunk来代替；
    使用optimization.noEmitOnErrors来替换NoEmitOnErrorsPlugin插件
    使用optimization.namedModules来替换NamedModulesPlugin插件
  • loader
    废弃json-loader，友好支持json模块，以ES Moudle的语法引入，还可以对json模块进行tree-shaking处理；

webpack 4 升级点的更多相关文章

  1. webpack 3 升级 webpack4 个人笔记

    参考文章: 1. webpack4升级完全指南 https://segmentfault.com/a/1190000014247030 2. Mobx useStrict is not a funct ...

  2. webpack 3 升级到 webpack 4，遇到问题解决

    报错:Error: Chunk.entrypoints: Use Chunks.groupsIterable and filter by instanceof Entrypoint instead 解 ...

  3. webpack(构建一个前端项目)详解--升级

    升级一个正式的项目结构 分离webpack.config.js文件: 新建一个webpack.config.base.js任何环境依赖的wbpack //public webpack const pa ...

  4. 【webpack整理】一、安装、配置、按需加载

    如果你: 是前端热爱者 :) 有JavaScript/nodejs基础 会使用一些常用命令行,mkdir,cd,etc. 会使用npm 想对webpack有更深的认识,或许此时你恰好遇到关于webpa ...

  5. Webpack 3 中的新特性

    本文简短地分享下最新发布的 Webpack 3 中的新特性,供大家参考. 1. Webpack 3 的新特性 6 月 20 日,Webpack 发布了最新的 3.0 版本,并在 Medium 发布了公 ...

  6. 轻松把你的项目升级到PWA

    什么是PWA PWA(Progressive Web Apps,渐进式网页应用)是Google在2015年推出的项目,致力于通过web app获得类似native app体验的网站. 优点 1.无需客 ...

  7. 在找一份相对完整的Webpack项目配置指南么？这里有

    Webpack已经出来很久了,相关的文章也有很多,然而比较完整的例子却不是很多,让很多新手不知如何下脚,下脚了又遍地坑 说实话,官方文档是蛮乱的,而且有些还是错的错的..很多配置问题只有爬过坑才知道 ...

  8. Web 性能优化： 使用 Webpack 分离数据的正确方法

    摘要: Webpack骚操作. 原文:Web 性能优化: 使用 Webpack 分离数据的正确方法 作者:前端小智 Fundebug经授权转载,版权归原作者所有. 制定向用户提供文件的最佳方式可能是一 ...

  9. webpack新版本4.12应用九(配置文件之configuration)

    配置 查看原文|编辑此页 webpack 是需要传入一个配置对象(configuration object).取决于你如何使用 webpack,可以通过两种方式之一:终端或 Node.js.下面指定了 ...

随机推荐

  1. 数位DP详解

    算法使用范围 在一个区间里面求有多少个满足题目所给的约束条件的数,约束条件必须与数自身的属性有关 下面用kuangbin数位dp的题来介绍 例题  不要62 题意:在一个区间里面求出有多少个不含4和6 ...

  2. ClickOnce 和管理员权限

    有些程序需要管理员权限需要运行,同时又想用ClickOnce进行发布,这时候就麻烦了,两者是互斥的. 解决方案是,去掉管理员权限的要求,可以进行发布. 程序启动的时候,加载程序员权限的请求. 代码如下 ...

  3. 2017年3月1日09:45:39 css选择器，session数据取不到

    昨天碰到了一个问题,通过输入指定的url进行登录在服务端将url存在session中但是登陆之后因为页面提交的登录请求是ajax请求,在后端提取session时获取不当之前存的url,老司机说不是同一 ...

  4. springsecurity基于数据库验证用户

    之前的springsecurity程序都是将数据存放在内存中的,通过 <security:user-service> <security:user name="user&q ...

  5. js基础 三种弹出框 数据类型

    总结:js三个组成部分ES:语法DOM:对象模型 => 通过js代码与页面文档(出现在body中的所有可视化标签)进行交互BOM:对象模型 => 通过js代码与浏览器自带功能进行交互 引入 ...

  6. 2019-03-06-day012-生成器与推导式

    01 昨日回顾 迭代器: 迭代器有iter方法 next方法就是迭代器 递归: 自己调用自己 明确的结束条件 递归的最大深度 官方 1000 实际测试:998/997 import sys sys.s ...

  7. 分析攻击IP来源地并画出饼图

    此文中的API将台湾列为国家,非本人立场,台湾属于中国,台湾岛生活的人不一定! 上码: #!/usr/bin/python #coding=utf-8 ''' http://ip-api.com/js ...

  8. 'autocomplete="off"'在Chrome中不起作用解决方案

    1.正确的姿势是: <input type="password" name="password" autocomplete="new-passw ...

  9. [转]Skynet之斗转星移 - 将控制权交给Lua

      Skynet之斗转星移 - 将控制权交给Lua http://www.outsky.org/code/skynet-lua.html Sep 7, 2014 在我看来,Skynet的一个重要优势是 ...

  10. Gym - 101806R ：Recipe（分治+斜率优化）

    题意:有一个厨师,他买菜-做菜-买菜-做菜....-做菜,一共有N天,他的冰箱里只能有一个菜,在他做菜的第二天才会买菜,如果菜不做,放在冰箱里,每天新鲜程度会下降1. 第一天也会买菜,第i天的菜新鲜程 ...