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. 51nod1042

    给出一段区间a-b,统计这个区间内0-9出现的次数.   比如 10-19,1出现11次(10,11,12,13,14,15,16,17,18,19,其中11包括2个1),其余数字各出现1次. Inp ...

  2. 互评Final版本

    作业要求[https://edu.cnblogs.com/campus/nenu/2018fall/homework/2478] 基于NABCD评论作品,及改进建议 杨老师粉丝群.作品:<Pin ...

  3. Linux 添加程序图标到开始菜单中

    Linux平台的Ubuntu系统中,开始菜单中的程序都在/usr/share/applications/目录下,文件格式都是xxxx.desktop ========================= ...

  4. 什么是wsgi,uwsgi,uWSGI

    WSGI: web服务器网关接口,是一套协议.用于接收用户请求将请求进行初次封装,然后将请求交给web框架 实现wsgi协议的模块: 1,wsgiref,本质就是编写一个socket服务端,用于接收用 ...

  5. Spring Boot 揭秘与实战(二) 数据存储篇 - 数据访问与多数据源配置

    文章目录 1. 环境依赖 2. 数据源 3. 单元测试 4. 源代码 在某些场景下,我们可能会在一个应用中需要依赖和访问多个数据源,例如针对于 MySQL 的分库场景.因此,我们需要配置多个数据源. ...

  6. java杨辉三角和空心菱形(二维数组篇)

    一.杨辉三角 import java.util.Scanner; //导入包 public class Test7 { public static void main(String[]args){ S ...

  7. 双向重定向tee命令详解

    vim一般在训练网络的时候需要保存log文件,同时需要在屏幕上网络的输出信息,在shell文件中常常会看到如下代码 执行的命令 2>&1 | tee log.txt tee是linux中 ...

  8. golang图片裁剪和缩略图生成

    直接贴代码了 package main import ( "errors" "fmt" "image" "image/gif&qu ...

  9. SVD分解求解旋转矩阵

    1.设是两组Rd空间的点集,可根据这两个点集计算它们之间的旋转平移信息. 2.设R为不变量,对T求导得: 令 则 将(4)带入(1)得: 令 则 (相当于对原来点集做减中心点预处理,再求旋转量) 3. ...

  10. day 019 常用模块

    主要内容: 1模块的简单认识 2collection模块 3time时间模块 4random模块 5os模块 6sys模块 一  模块的简单认识 引入模块的方式:  1import (常见方式) 2 ...