专栏首页京程一灯最新发布!webpack 4.0.0-alpha.0 特性

最新发布!webpack 4.0.0-alpha.0 特性

重大更新

  • Node.js 4不再受到支持。源代码被升级到更高的ecmascript版本。
  • 你现在可以使用(mode--mode) 在两种模式之间选择:生产模式或开发模式
    • WIP:在开发模式中增加提示
    • 生产模式能够通过各种手段来生成优化的捆绑包
    • 开发模式使开发过程中能够使用注释和提示和eval devtool
    • 生产模式不支持watching,开发模式被优化为快速增量重建
    • 生产模式也使模块连接(范围提升)
    • 你可以使用optimization.*标志详细配置此功能(构建你的自定义模式)
    • process.env.NODE_ENV 被设置为生产或开发(只在构建代码中,而不是在配置中)
    • 有一个隐藏的 none 模式,禁用一切
  • import() 总是返回一个名称空间对象。 CommonJS模块被封装到默认导出中
    • 如果你用 import()导入CommonJs可能会破坏你的代码
  • 你不再需要使用这些插件:
    • NoEmitOnErrorsPlugin - > optimize.noEmitOnErrors(在生产模式下默认打开)
    • ModuleConcatenationPlugin - > optimize.concatenateModules(默认处于生产模式)
  • webpack现在处理JSON不同
    • 将JSON通过加载器转换为JS时,可能需要添加type:"javascript / esm"
    • 只使用JSON而没有加载器应该仍然可以工作

重要特性

  • webpack现在支持这些模块类型:
    • javascript / auto:(在webpack 3中默认的)启用了所有模块系统的Javascript模块:CommonJS,AMD,ESM
    • javascript / esm:EcmaScript模块,所有其他模块系统不可用
    • json:JSON数据,JSON数据传递不变,不被解析
    • webassembly / experimental:WebAssembly模块(目前是实验性的)
  • javascript / auto相比,javascript / esm处理更严格的ESM:
    • 导入的名称需要在导入的模块上存在
    • 非ESM只能通过默认导入导入,其他所有(包括命名空间导入)都会发出错误
  • .mjs模块中
    • 使用javascript/esm
    • 进口需要有一个扩展。 没有扩展尝试。
  • sideEffects:falsepackage.json中受支持
  • 使用JSONP数组而不是JSONP函数->异步支持
    • WIP:还没有办法将运行时移动到另一个块
  • webpackIncludewebpackExcludeimport()的魔法注释支持。 它们允许在使用动态表达式时过滤文件。
  • 现在可以使用module.rules[].resolve来配置解析。 它与全局配置合并。
  • Sone Plugin选项现在已经过验证
    • WIP:更好的输出,没有进程退出,堆栈跟踪,更多的插件
  • 多重性能改进,特别是对于更快的增量重建

特性

  • 通过CLI添加的插件预先优先于配置插件
  • 模块类型自动选择为mjs,json和wasm扩展名。其他扩展需要通过module.rules [].type进行配置
  • 添加指向上下文选项的loaderContext.rootContext。装载器可以使用它来创建相对于应用程序根目录的东西。
  • 块加载错误现在包含更多信息和两个新的属性typerequest
  • 不正确的options.dependencies配置现在会抛出错误
  • webpacks AST 可以直接从加载器传递给webpack以避免额外的解析
  • 当使用超过25个出口时,出口名称变短。
  • webpack现在按此顺序查找.wasm.mjs.js.json扩展名
  • 现在尺寸显示为kiB,而不是统计中的kB
  • 上下文支持资源查询
  • 在开发模式下,output.pathinfo默认处于开启状态
  • 内存缓存在生产中默认关闭
  • 脚本标签不再是text/JavaScriptasync,因为这是默认值(保存几个字节)

修复的bug

  • 生成的注释不再丢失 */
  • webpack不再修改传递的选项对象
  • 编译器“watch-run”钩子没有编译器作为第一个参数
  • chunkCallbackName添加到模式以允许配置WebWorker模板

移除的特性

  • 移除 module.loaders
  • 移除 loaderContext.options
  • 移除 Compilation.notCacheable flag
  • 移除 NoErrorsPlugin
  • 移除 Dependency.isEqualResource
  • 移除 NewWatchingPlugin

中断的插件修改

  • 新的插件系统
    • plugin方法是向后兼容的
    • 插件现在应该使用Compiler.hooks.xxx.tap(<plugin name>, fn)
  • 增强解决方案的新主要版本
  • 块的模板现在可以生成多个资产
  • chunk.chunks/parents/blocks不再是数组。一个集合在内部使用,并有方法来访问它。
  • Parser.scope.renamesParser.scope.definitions不再是对象/数组,而是映射/集合。
  • 解析器使用StackedSetMap(类似于LevelDB的数据结构)而不是数组
  • 在应用插件时不再设置Compiler.options
  • 和谐相依性因重构而改变
  • Dependency.getReference()现在可能返回一个weak属性。 Dependency.weak现在被Dependency基类使用,并在getReference()的基本实现中返回
  • 为所有模块更改构造函数参数
  • 将选项合并到ContextModuleresolveDependencies的选项对象中
  • 更改和重命名import()的依赖关系
  • 将Compiler.resolvers移入可通过插件访问的Compiler.resolverFactory
  • Dependency.isEqualResource已被替换为Dependency.getResourceIdentifier

不兼容的插件

html-webpack-plugin: 插件系统升级 (jantimon/html-webpack-plugin#816)请提交意见

不兼容的加载器

  • file-loader -> Workaround A
  • vue-loader -> Workaround A
  • ejs-loader -> Workaround A
  • eslint-loader -> Workaround A请提交意见

缺失的特性

请提交意见

解决方法:

Workround A

对于不能使用this.options迁移的加载器:

  new LoaderOptionsPlugin({
    options: {
      context: process.cwd() // or the same value as `context`
    }
  })

不要指望这个alpha版本是超稳定的...


如果您在更改日志中发现其他更改,请发表评论


往期精选文章

使用虚拟dom和JavaScript构建完全响应式的UI框架

扩展 Vue 组件

使用Three.js制作酷炫无比的无穷隧道特效

一个治愈JavaScript疲劳的学习计划

全栈工程师技能大全

WEB前端性能优化常见方法

一小时内搭建一个全栈Web应用框架

干货:CSS 专业技巧

四步实现React页面过渡动画效果

让你分分钟理解 JavaScript 闭包



小手一抖,资料全有。长按二维码关注京程一灯,阅读更多技术文章和业界动态。

本文分享自微信公众号 - 京程一灯(jingchengyideng)

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2017-12-05

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

推荐阅读

  • 远程办公经验为0,如何将日常工作平滑过度到线上?

    我是一名创业者,我的公司(深圳市友浩达科技有限公司)在2018年8月8日开始运营,现在还属于微型公司。这个春节假期,我一直十分关注疫情动向,也非常关心其对公司带来的影响。

    TVP官方团队
    TAPD 敏捷项目管理腾讯乐享企业邮箱企业编程算法
  • 数据中台,概念炒作还是另有奇效? | TVP思享

    作者简介:史凯,花名凯哥,腾讯云最具价值专家TVP,ThoughtWorks数据智能业务总经理。投身于企业数字化转型工作近20年。2000年初,在IBM 研发企业级中间件,接着加入埃森哲,为大型企业提供信息化架构规划,设计,ERP,云平台,数据仓库构建等技术咨询实施服务,随后在EMC负责企业应用转型业务,为企业提供云迁移,应用现代化服务。现在专注于企业智能化转型领域,是数据驱动的数字化转型的行业布道者,数据中台的推广者,精益数据创新体系的创始人,2019年荣获全球Data IQ 100人的数据赋能者称号,创业邦卓越生态聚合赋能官TOP 5。2019年度数字化转型专家奖。打造了行业第一个数据创新的数字化转型卡牌和工作坊。创建了精益数据创新方法论体系构建数据驱动的智能企业,并在多个企业验证成功,正在向国内外推广。

    TVP官方团队
    大数据数据分析企业
  • 扩展 Kubernetes 之 CRI

    使用 cri-containerd 的调用流程更为简洁, 省去了上面的调用流程的 1,2 两步

    王磊-AI基础
    Kubernetes
  • 扩展 Kubernetes 之 Kubectl Plugin

    kubectl 功能非常强大, 常见的命令使用方式可以参考 kubectl --help,或者这篇文章

    王磊-AI基础
    Kubernetes
  • 多种登录方式定量性能测试方案

    最近接到到一个测试任务,某服务提供了两种登录方式:1、账号密码登录;2、手机号+验证码登录。要对这两种登录按照一定的比例进行压测。

    八音弦
    测试服务 WeTest
  • 线程安全类在性能测试中应用

    首先验证接口参数签名是否正确,然后加锁去判断订单信息和状态,处理用户增添VIP时间事务,成功之后释放锁。锁是针对用户和订单的分布式锁,使用方案是用的redis。

    八音弦
    安全编程算法
  • 使用CDN(jsdelivr) 优化博客访问速度

    PS: 此篇文章适用于 使用 Github pages 或者 coding pages 的朋友,其他博客也类似.

    IFONLY@CUIT
    CDNGitGitHub开源
  • 扩展 Kubernetes 之 CNI

    Network Configuration 是 CNI 输入参数中最重要当部分, 可以存储在磁盘上

    王磊-AI基础
    Kubernetes
  • 聚焦【技术应变力】云加社区沙龙online重磅上线!

    云加社区结合特殊时期热点,挑选备受关注的音视频流量暴增、线下业务快速转线上、紧急上线防疫IoT应用等话题,邀请众多业界专家,为大家提供连续十一天的干货分享。从视野、预判、应对等多角度,帮助大家全面提升「技术应变力」!

    腾小云
  • 京东购物小程序购物车性能优化实践

    它是小程序开发工具内置的一个可视化监控工具,能够在 OS 级别上实时记录系统资源的使用情况。

    WecTeam
    渲染JavaScripthttps网络安全缓存

扫码关注云+社区

领取腾讯云代金券