1、不再支持node.js4.X

2、不能用webpack命令直接打包指定的文件,只能使用webpack.config.js进行配置。

即:webpack  demo01.js  bundle01.js 不能用了。

3、CLI被移动到了一个专门的包 webpack-cli里了。

全局安装webpack-cli

命令:npm install webpack-cli -g

4、本地(项目目录)下安装webpack,

命令:npm install webpack -D

5、在webpack.config.js里的配置,不再支持 module下的loaders,需要把loaders改成rules。

如下:

module: {

rules: [
            //针对css文件,进行对应的loader处理
            { test: /\.css$/, loader: "style-loader!css-loader" }
        ]

}

7、json

webpack 现在能原生地处理 JSON

允许通过 ESM 语法导入 JSON

8、优化:

更新 uglifyjs-webpack-plugin 至 v1 版本,以支持 ES2015

9、Usage

现在可以在两种模式中选择 (mode or --mode) : 生产模式或开发模式

10、配置:

NoEmitOnErrorsPlugin -> optimization.noEmitOnErrors (生产模式下默认开启)
       ModuleConcatenationPlugin -> optimization.concatenateModules (开发模式下默认开启)
       NamedModulesPlugin -> optimization.namedModules (开发模式下默认开启)
       CommonsChunkPlugin 已被移除 -> optimization.splitChunks, optimization.runtimeChunk

11、Syntax

import() 总是返回一个命名空间对象。CommonJS 模块被封装到默认导出中

12、还有一个坑,暂时还没有解决,正在研究:

用 import Vue from "vue";  引入vue有问题,

但是改成

import Vue from "vue/dist/vue.js";

是可以用的。

【转】webpack4的更多相关文章

  1. mini-css-extract-plugin 的用法(webpack4)

    今天在使用webpack的extract-text-webpack-plugin插件提取单独打包css文件时,报错,说是这个插件要依赖webpack3的版本. 后面查了一下,webpack4得使用mi ...

  2. webpack4: compilation.mainTemplate.applyPluginsWaterfall is not a function 解决方法

    今天捣鼓webpack4踩到一个弥天大坑:使用html-webpack-plugin打包html的时候一直报 compilation.mainTemplate.applyPluginsWaterfal ...

  3. webpack4新特性介绍

    导语: webpack是一个JS应用打包器, 它将应用中的各个模块打成一个或者多个bundle文件.借助loaders和plugins,它可以改变.压缩和优化各种各样的文件.它的输入是不同的资源,比如 ...

  4. webpack4.1.1的使用详细教程

    安装全局webpack cnpm install -g webpack 安装全局webpack-cli npm install -g webpack-cli 初始化:生成package.json文件 ...

  5. webpack4.x配置详解,多页面,多入口,多出口,新特性新坑!!

    花了差不多一天多的时间,重新撸了一遍webpack4.x的常用配置. 基本上常用的配置都熟悉了一遍,总体上来讲,为了对parcel进行反击,webpack从4.x开始,正在朝着尽可能的简化配置文件的方 ...

  6. webpack4 splitChunksPlugin && runtimeChunkPlugin 配置杂记

    webpack2 还没研究好,就发现升级到4了,你咋这么快~ 最近要做项目脚手架,项目构建准备重新做,因为之前写的太烂了...然后发现webpack大版本已经升到4了(又去看了一眼,4.5了),这么快 ...

  7. webpack4:连奏中的进化

    webpack4在2月底的时候发布,这次webpack4有了一个名字"Legato",也就是"连奏"的意思,寓意webpack在不断进化,而且是无缝(no-ga ...

  8. React从入门到放弃之前奏(1):webpack4简介

    接触webpack是好久之前的事情了,最近看了下webpack没想到都到4了. webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler). 会创建1个 ...

  9. 带你由浅入深探索webpack4(二)

    在前一篇文章已经介绍了webpack4从入门到一些核心常用的用法,大家可以从上一篇文章看起.带你由浅入深探索webpack4(一) 接着上一章,接下来我们会继续探讨webpack4中的各种实用用法,让 ...

  10. webpack4打包nodejs项目进阶版——多页应用模板

    前段时间我写了个打包nodejs项目的文章,点击前往 但是,问题很多.因为之前的项目是个历史遗留项目,重构起来可能会爆炸,当时又比较急所以就写个的适用范围很小的webpack的打包方法. 最近稍微得空 ...

随机推荐

  1. 一位90后程序员的自述:如何从年薪3w到30w

    ▌自我介绍 引用赵真老师的一首歌<过去不是错>中的一句话:过去不是过错,毕竟我们也开心过.过去不是过错,何必愧疚不知所措. 我们这一代人,我相信多少都会有人和我一样,坚持过一个游戏,叫 D ...

  2. java8新特性学习1

    java8增加了不少新特性,下面就一些常见的新特性进行学习... 1.接口中的方法 2.函数式接口 3.Lambda表达式 4.java8内置的四大核心函数式接口 5.方法引用和构造器引用 6.Str ...

  3. JAVAOOP I/O

    程序的主要任务就是操作数据,通过允许程序读取文件的内容或向文件写入数据,可以使程序应用更加广泛. I/O(input/output) 在不同操作系统之下,所占的字节数也不同,一般认为 8.1.1使用F ...

  4. 【shell脚本学习-4】

    文本处理 #!/bin/bash#----------文本处理---------- #---------------echo----------------- # "-n":处理光 ...

  5. Mina 组件介绍之 IoAcceptor 与 IoConnector

    在网络通信中,Socket通信的双方分为服务端与客户端,在Java NIO 的实现中采用Socket/ServerSocket, SocketChannel/ServerSocketChannel分别 ...

  6. djangorestframework怎么这么好用!

    一年前就已经用过restframework, 当时觉得这个只是给web框架打辅助的, 他能实现的我也都实现(可能没有那么好用, 嘿嘿) 但是我有一种东西叫做效率, 时间就是金钱, 别人造好的就直接用就 ...

  7. collections模块的使用

    1. Counter counter是collections中的一个模块, 它能够统计出字符串/文本中的每一个元素出现的次数, 并可以对结果进行进一步的处理. 使用方法 传入: 字符串 默认返回: C ...

  8. python字符串编码

    python默认编码 python 2.x默认的字符编码是ASCII,默认的文件编码也是ASCII. python 3.x默认的字符编码是unicode,默认的文件编码是utf-8. 中文乱码问题 无 ...

  9. latex02-LaTeX源文件的基本结构

    1.一个latex文件有且仅有一个document环境 %后表示注释 2.latex的导言区用于全局设置. 例如:title\author\date 加入空行是结构更加清晰 为了能正确的使用标题信息, ...

  10. 勾股数--Python

    勾股数:勾股数又名毕氏三元数 .勾股数就是可以构成一个直角三角形三边的一组正整数.勾股定理:直角三角形两条直角边a.b的平方和等于斜边c的平方(a²+b²=c²) 要求:输出1000以内的勾股数 fr ...