-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathintro.html
23 lines (22 loc) · 9.64 KB
/
intro.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>前言 | 深入浅出Webpack</title>
<meta name="description" content="webpack使用学习(吴浩麟版)">
<link rel="icon" href="/webpackLearn/favicon.ico">
<link rel="manifest" href="/webpackLearn/manifest.json">
<link rel="preload" href="/webpackLearn/assets/css/styles.77d280ee.css" as="style"><link rel="preload" href="/webpackLearn/assets/js/app.77d280ee.js" as="script"><link rel="preload" href="/webpackLearn/assets/js/15.593f55f2.js" as="script"><link rel="prefetch" href="/webpackLearn/assets/js/1.f37f7214.js"><link rel="prefetch" href="/webpackLearn/assets/js/10.15a163ee.js"><link rel="prefetch" href="/webpackLearn/assets/js/11.d8cde28c.js"><link rel="prefetch" href="/webpackLearn/assets/js/12.6e485d95.js"><link rel="prefetch" href="/webpackLearn/assets/js/13.8167464c.js"><link rel="prefetch" href="/webpackLearn/assets/js/14.7e75c412.js"><link rel="prefetch" href="/webpackLearn/assets/js/16.31248cfb.js"><link rel="prefetch" href="/webpackLearn/assets/js/17.c428f9be.js"><link rel="prefetch" href="/webpackLearn/assets/js/18.1a442e25.js"><link rel="prefetch" href="/webpackLearn/assets/js/19.d2aaef13.js"><link rel="prefetch" href="/webpackLearn/assets/js/2.d7cdf3d2.js"><link rel="prefetch" href="/webpackLearn/assets/js/20.d7645fb0.js"><link rel="prefetch" href="/webpackLearn/assets/js/21.d80e0286.js"><link rel="prefetch" href="/webpackLearn/assets/js/22.b41f3cbc.js"><link rel="prefetch" href="/webpackLearn/assets/js/23.f8779f82.js"><link rel="prefetch" href="/webpackLearn/assets/js/24.958d3c85.js"><link rel="prefetch" href="/webpackLearn/assets/js/25.2e076f51.js"><link rel="prefetch" href="/webpackLearn/assets/js/26.eff2c3e5.js"><link rel="prefetch" href="/webpackLearn/assets/js/27.40064e0e.js"><link rel="prefetch" href="/webpackLearn/assets/js/28.9ad06b95.js"><link rel="prefetch" href="/webpackLearn/assets/js/29.3a0865a0.js"><link rel="prefetch" href="/webpackLearn/assets/js/3.128b6292.js"><link rel="prefetch" href="/webpackLearn/assets/js/30.25c4f77e.js"><link rel="prefetch" href="/webpackLearn/assets/js/31.80207808.js"><link rel="prefetch" href="/webpackLearn/assets/js/32.20b8aa68.js"><link rel="prefetch" href="/webpackLearn/assets/js/33.414db07e.js"><link rel="prefetch" href="/webpackLearn/assets/js/34.3c015b40.js"><link rel="prefetch" href="/webpackLearn/assets/js/35.cfff3ee7.js"><link rel="prefetch" href="/webpackLearn/assets/js/36.5693324e.js"><link rel="prefetch" href="/webpackLearn/assets/js/37.11302d4c.js"><link rel="prefetch" href="/webpackLearn/assets/js/38.5f09cd6d.js"><link rel="prefetch" href="/webpackLearn/assets/js/39.b8a318d2.js"><link rel="prefetch" href="/webpackLearn/assets/js/4.7fbde3f9.js"><link rel="prefetch" href="/webpackLearn/assets/js/40.010eca0d.js"><link rel="prefetch" href="/webpackLearn/assets/js/41.ed550296.js"><link rel="prefetch" href="/webpackLearn/assets/js/42.bf111eba.js"><link rel="prefetch" href="/webpackLearn/assets/js/43.4178a489.js"><link rel="prefetch" href="/webpackLearn/assets/js/44.f9b7d3d8.js"><link rel="prefetch" href="/webpackLearn/assets/js/45.4aa3e07a.js"><link rel="prefetch" href="/webpackLearn/assets/js/46.766fddaf.js"><link rel="prefetch" href="/webpackLearn/assets/js/47.7a16de60.js"><link rel="prefetch" href="/webpackLearn/assets/js/48.ec0b2eb5.js"><link rel="prefetch" href="/webpackLearn/assets/js/49.9ba3c919.js"><link rel="prefetch" href="/webpackLearn/assets/js/5.7aab97c6.js"><link rel="prefetch" href="/webpackLearn/assets/js/50.fe7bdfef.js"><link rel="prefetch" href="/webpackLearn/assets/js/51.b5d4459d.js"><link rel="prefetch" href="/webpackLearn/assets/js/52.aa5814ff.js"><link rel="prefetch" href="/webpackLearn/assets/js/53.8ad00778.js"><link rel="prefetch" href="/webpackLearn/assets/js/54.92f9cbd1.js"><link rel="prefetch" href="/webpackLearn/assets/js/55.d04ea61a.js"><link rel="prefetch" href="/webpackLearn/assets/js/56.4b17dc92.js"><link rel="prefetch" href="/webpackLearn/assets/js/57.82800a68.js"><link rel="prefetch" href="/webpackLearn/assets/js/58.b4482327.js"><link rel="prefetch" href="/webpackLearn/assets/js/59.40bf3560.js"><link rel="prefetch" href="/webpackLearn/assets/js/6.e891bd55.js"><link rel="prefetch" href="/webpackLearn/assets/js/60.3a147a38.js"><link rel="prefetch" href="/webpackLearn/assets/js/61.9fab59f3.js"><link rel="prefetch" href="/webpackLearn/assets/js/62.7aacd083.js"><link rel="prefetch" href="/webpackLearn/assets/js/63.7e09e4d8.js"><link rel="prefetch" href="/webpackLearn/assets/js/64.b3113e47.js"><link rel="prefetch" href="/webpackLearn/assets/js/65.d1030852.js"><link rel="prefetch" href="/webpackLearn/assets/js/66.799e920a.js"><link rel="prefetch" href="/webpackLearn/assets/js/67.a898b698.js"><link rel="prefetch" href="/webpackLearn/assets/js/68.92cd43e9.js"><link rel="prefetch" href="/webpackLearn/assets/js/69.262008ea.js"><link rel="prefetch" href="/webpackLearn/assets/js/7.22611dc1.js"><link rel="prefetch" href="/webpackLearn/assets/js/70.afff8df7.js"><link rel="prefetch" href="/webpackLearn/assets/js/71.7818a2c2.js"><link rel="prefetch" href="/webpackLearn/assets/js/8.5b18428a.js"><link rel="prefetch" href="/webpackLearn/assets/js/9.9ef066a0.js">
<link rel="stylesheet" href="/webpackLearn/assets/css/styles.77d280ee.css">
</head>
<body>
<div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div><a href="/webpackLearn/" class="home-link router-link-active"><!----><span class="site-name">
深入浅出Webpack
</span></a><div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""><!----></div><nav class="nav-links can-hide"><div class="nav-item"><a href="/webpackLearn/" class="nav-link">首页</a></div><!----></nav></div></header><div class="sidebar-mask"></div><div class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/webpackLearn/" class="nav-link">首页</a></div><!----></nav><ul class="sidebar-links"><li><div class="sidebar-group first"><p class="sidebar-heading open"><span>入门</span><!----></p><ul class="sidebar-group-items"><li><a href="/webpackLearn/intro.html" class="active sidebar-link">前言</a></li><li><a href="/webpackLearn/intro/intro-1.html" class="sidebar-link">前端的发展</a></li><li><a href="/webpackLearn/intro/intro-2.html" class="sidebar-link">前端常用构建工具</a></li><li><a href="/webpackLearn/intro/intro-3.html" class="sidebar-link">webpack安装使用</a></li><li><a href="/webpackLearn/intro/intro-4.html" class="sidebar-link">使用Loader</a></li><li><a href="/webpackLearn/intro/intro-5.html" class="sidebar-link">使用Plugin</a></li><li><a href="/webpackLearn/intro/intro-6.html" class="sidebar-link">使用DevServer</a></li><li><a href="/webpackLearn/intro/intro-7.html" class="sidebar-link">核心概念</a></li></ul></div></li><li><div class="sidebar-group collapsable"><p class="sidebar-heading"><span>配置</span><span class="arrow right"></span></p><!----></div></li><li><div class="sidebar-group collapsable"><p class="sidebar-heading"><span>实战</span><span class="arrow right"></span></p><!----></div></li><li><div class="sidebar-group collapsable"><p class="sidebar-heading"><span>优化</span><span class="arrow right"></span></p><!----></div></li><li><div class="sidebar-group collapsable"><p class="sidebar-heading"><span>原理</span><span class="arrow right"></span></p><!----></div></li><li><div class="sidebar-group collapsable"><p class="sidebar-heading"><span>附录</span><span class="arrow right"></span></p><!----></div></li></ul></div><div class="page"><div class="content"><h1 id="前言"><a href="#前言" aria-hidden="true" class="header-anchor">#</a> 前言</h1><p>Web 应用日益复杂，相关开发技术也百花齐放，这对前端构建工具提出了更高的要求。 Webpack 从众多构建工具中脱颖而出成为目前最流行的构建工具，几乎成为前端开发里的必备工具之一， 因此每位紧跟时代的前端工程师都应该掌握 Webpack。</p><p>本书从实践出发，用简单易懂的例子带你快速入门Webpack，再结合实际工作中常用的场景给出最佳实战，通过 <strong>前3章</strong>的学习足以让你解决工作中的常见问题； 本书还介绍了如何优化构建的速度和输出，并解析了Webpack的工作原理，以及 Plugin和Loader的编写方法，可帮助你进一步学习Webpack。 本书按照入门、配置、实战、优化和原理的路线层层深入，涵盖了Webpack的方方面面。</p><p>本文主要基于webpack3版本的特性解析。 由于Webpack从版本1到现在，其核心思想和API没有发生很大的变化，所以文中大部分内容适用于Webpack的任何稳定版本，但部分实例代码只适用于最新版本。</p></div><div class="page-edit"><!----><!----></div><div class="page-nav"><p class="inner"><!----><span class="next"><a href="/webpackLearn/intro/intro-1.html">
前端的发展
</a> →
</span></p></div></div></div></div>
<script src="/webpackLearn/assets/js/app.77d280ee.js" defer></script><script src="/webpackLearn/assets/js/15.593f55f2.js" defer></script>
</body>
</html>