Webpack Deep Dive 中文字幕
Webpack详解 中文字幕Webpack Deep Dive
构建和部署前端应用程序可能会很快变得复杂
webpack通过提供满足各种JavaScript应用程序的大量功能,简化了管理Web依赖项的任务
在本课程中,探索这些功能,并学习如何将现有的JavaScript应用程序迁移到webpack 2.加入Kent Dodds,他解释了如何将应用程序迁移到webpack 2,其中涵盖了诸如使用Karma进行单元测试,树形抖动,代码拆分 ,组块等等
注意:本课程由Frontend Masters创建
它最初是在2016年8月8日发布的
我们很高兴在我们的图书馆举办这一培训
主题包括:
初始化webpack
开发与生产环境
调试webpack
加载CSS
使用webpack进行测试
覆盖面基础
webpack优化
树在颤抖
代码拆分
(喜欢冒险的音乐) - 我喜欢我们可以拥有如此多元化的人群,他们都在学习类似的技术并解决世界各地不同的问题。
我觉得这很酷。
我感谢你们花些时间来了解我关心的东西,这是Webpack。
我喜欢Webpack。
这就是这个研讨会的内容。
我喜欢设定期望值,以便您不只是坐着,等待一些永远不会发生的事情。
我们将把现有的JavaScript应用程序迁移到Webpack Two。
整个过程就是迁移这个应用程序。
这是非常基本的,在所有应用程序中都没有构建系统。
你有一个带有一些脚本标签和一些CSS的索引HTML。
所以非常基本,我们使用的是Webpack Two,所以我认为教你技术即将得到重大升级是没有用的,特别是当Webpack Two …
它不仅非常好,测试版真的很好,但它几乎已经发布了。
他们几乎致力于8月底,所以这非常令人兴奋。
阻止它回归的主要原因是文档就是这样。
实际上,Webpack现在正在引起广泛的关注,特别是在Angular CLI已经采用它的情况下,它正在运行。
然后,React创建了使用Webpack的Create React应用程序,因此就像现在这些知识一样。
这很棒。
Webpack比现有的更受关注。
它会变得越来越好。
我们将做Webpack Two。
我们将进行单元测试,因为单元测试我认为每个人都理解测试的价值,并且意识到模具设置有多困难。
这就是整个研讨会关于工具的原因。
所以我们将使用摩卡。
这里有人熟悉摩卡吗?
使用摩卡?
凉。
有人使用噶玛?
或者对不起,呃,噶。
谁使用Karma?
那么有人使用茉莉花?
好,甜心。
茉莉花也很棒。
我更喜欢摩卡。
柴,之前有人用柴吗?
好的,我们将使用Chai。
酷,然后我们将使用我列在这里的所有这些功能。
树形抖动,代码拆分,长期缓存哈希,分块,服务工作者等等。
所以,如果你不了解所有这些术语或者很好地了解它们,那很棒,因为这就是你在这里的原因。
我们将讨论这个问题。
然后,我们将部署应用程序surge.sh。
谁熟悉那项服务?
好吧,这很好。
这是一个CDN,基本上你只是给它静态文件,它真的非常快。
是的,这是缓存策略。
这真的很棒,它可以帮助你解决问题。
这很棒。
到一天结束时,您都必须将MBC部署到您自己的surge.sh URL中。
那很有趣。
你可以与你的朋友分享,并写下待办事项和东西。
所以有几件事情我们不会太过分。
我不打算谈论Webpack或其生态系统中可用的所有功能。
除非我们有时间,否则我们实际上不会写插件或加载器。
我写了一个插件和一些装载机。
所以,如果我们有最后的时间,那么也许我们会调查它,但我在这个模块中没有任何东西。
在我发出的事件调查中,你们中有几个人真的希望进入插件和加载程序并编写自己的代码。
我只想说我已经使用Webpack超过一年半了,我只需要编写一个自定义插件或加载器几次。
已经有很多插件和加载器,你通常不需要自己的插件和加载器。
文档正在改进,因此编写这些文档变得更加容易。
此外,我将要讨论的许多功能并不适用于您可能想到的所有应用程序。
对于某些应用程序,资产的长期缓存实际上不是最好的方法。
它只是取决于你正在使用的应用程序的类型。
另外,对于Angular One应用程序来说,仅仅因为Angular One的工作方式而进行代码拆分相当困难。
其中一些功能可能不适用于或适用于所有应用程序。
请注意这一点。
希望你们都拥有一切。
这些是你肯定需要的东西。
我今天早上或者昨晚试图做一些事情,所以你不需要Node 6版本,但是第四版本,或者甚至更旧版本的Node就足够了,但是我没有真正测试过。
希望每个人都有Node Six。
它应该与第六节一起工作。
此外,它应该适用于Windows。
我知道Windows存在一些困难。
我昨天晚上试图解决大部分这些问题。
如果你有问题,请问Kent,因为他有Windows问题。
希望我们能够共同努力找出问题所在。
幸运的是,linting对这次研讨会并不重要。
好吧,让我们继续并开始。
这是设置。
我实际上只是回到我在聊天中复制它的地方。
我复制了设置。
我要再聊一次。
如果你需要,那就是我开始交谈时你需要做的事情。
到最后,您应该能够运行NPM启动,然后打开本地主机8080,这是您应该看到的。
如果你没有看到,那就有问题了。
在我说完之后,我会仔细检查一下,或者你可以问你的邻居,但那会是的。
在我们真正开始在研讨会上工作之前,您需要掌握这一点。
本课程视频下载地址:Webpack详解