• This repository has been archived on 06/Mar/2024
  • Stars
    star
    627
  • Rank 71,190 (Top 2 %)
  • Language
    JavaScript
  • Created about 6 years ago
  • Updated about 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

📦 Demos && Courses for Webpack 4

webpack-demos:全网最贴心 webpack 系列教程和配套代码

Wow!全网最贴心的webpack4系列中文教程和配套代码 👇

放在开头

由于完全是博主利用业余时间编写和整理的,所以有些地方难免有失偏颇,还请多多海涵。如果您发现错误,欢迎致信 [email protected][email protected] ,我一定会在第一时间检查和修复!!!

如果本教程和示例代码对您的工作、学习或者爬坑有帮助,请动动您的小手,给个 Star,让更多的朋友了解并且参与进来,蟹蟹 ٩('ω')و

最后,欢迎转载和引用,但请指明出处(github 仓库或者博客文章地址均可)。这套教程和代码确实花费了博主很多精力和时间!

项目背景

上半年在做 web 项目的时候,在webpack上踩了很多坑。由于使用的是 webpack4,所以网上现成的教程并不多,而且大多数不成体系。还有很多教程,把很多知识点杂糅在一起进行讲解,对于新手来说真的很不友好。

所以我花费了 3 个多月整理了这份教程,一共分成 16 节,每节都有讲解,并且准备了配套代码。*应该说很贴心了吧哈哈哈。*当然,自己回查也很方便!

本来想着做成掘金小册,或者录个视频赚赚钱。奈何深感水平不够,只有一腔热情,所以直接开放了教程和源码。

项目地址

课程目录

  1. demo01: 打包JS
  2. demo02: 编译ES6
  3. demo03: 多页面解决方案--提取公共代码
  4. demo04: 单页面解决方案--代码分割和懒加载
  5. demo05: 处理CSS
  6. demo06: 处理Scss
  7. demo07: 提取Scss (CSS等等)
  8. demo08: JS Tree Shaking
  9. demo09: CSS Tree Shaking
  10. demo10: 图片处理--识别, 压缩, Base64编码, 合成雪碧图
  11. demo11: 字体文件处理
  12. demo12: 处理第三方JS
  13. demo13: 生成Html文件
  14. demo14: Watch Mode && Clean Plugin
  15. demo15: 开发模式--webpack-dev-server
  16. demo16: 生产模式和开发模式分离

代码目录

  1. demo01: 打包JS
  2. demo02: 编译ES6
  3. demo03: 多页面解决方案--提取公共代码
  4. demo04: 单页面解决方案--代码分割和懒加载
  5. demo05: 处理CSS
  6. demo06: 处理Scss
  7. demo07: 提取Scss (CSS等等)
  8. demo08: JS Tree Shaking
  9. demo09: CSS Tree Shaking
  10. demo10: 图片处理--识别, 压缩, Base64编码, 合成雪碧图
  11. demo11: 字体文件处理
  12. demo12: 处理第三方JS
  13. demo13: 生成Html文件
  14. demo14: Watch Mode && Clean Plugin
  15. demo15: 开发模式--webpack-dev-server
  16. demo16: 生产模式和开发模式分离

关于作者

More Repositories

1

blog

📚 专注Web与算法
Vue
1,372
star
2

theme-bmw

✋ Smart Voice: Voice for yourself | 微声: 请为自己发声
CSS
375
star
3

news-emotion

📉 金融文本情感分析模型
Python
330
star
4

theme-ad

🔨 Art design theme for write and show.
CSS
258
star
5

music-api-next

🎵 Music API for search results, songs, comments from QQ, Xiami and Netease.
JavaScript
66
star
6

cloudpress

✍️+☁️ : 基于云开发的开源博客系统
JavaScript
64
star
7

various-codes

个人代码/项目仓库(具体请看子目录下的README.md)。自取请注明出处,尊重原创,O(∩_∩)O谢谢
Python
45
star
8

vuepress-plugin-comment

Comment plugin in vuepress, such as Gitalk, Valine...
JavaScript
37
star
9

node-blockchain

Nodejs实现区块链
JavaScript
31
star
10

page-counter

基于Serverless开发的的极简网页计数器,支持基于Hexo、Jekyll、Octopress、ReactJS、VueJS等框架开发的博客、网站、中后台等任何应用。
JavaScript
31
star
11

pure-virtual-dom

🐝VDom+Diff+Patch的简明实现
JavaScript
23
star
12

onebook

📓 Write local, save github, DISPLAY HERE. Everyone can write one book and show yourself to the world!
JavaScript
14
star
13

vuejs-theme-bmw

Hexo depository is https://github.com/dongyuanxin/hexo-theme-bmw
Vue
12
star
14

play-node-command

玩转nodejs命令行
JavaScript
9
star
15

szu-mooc

深圳大学刷mooc脚本,Thanks♪(・ω・)ノ。
Python
6
star
16

leetcode

Leetcode 解题报告
JavaScript
4
star
17

system-process-schedule

nodejs 实现非抢占式的先到先来优先算法、短作业优先算法、高响应比优先算法以及时间片优先算法
JavaScript
4
star
18

ciy

Code it yourself.
JavaScript
3
star
19

old-dongyuanxin.github.io

HTML
3
star
20

dumall

🏪 商城系统
CSS
3
star
21

html5-drag-drop

HTML5的拖放事件学习与实践
JavaScript
3
star
22

design-pattern-demos

💗 Learn and Code Design Pattern every day based on LOVE.
JavaScript
2
star
23

dongyuanxin

2
star
24

markdown-static

个人博客代码存放
HTML
2
star
25

simple-koa

这是在阅读koa以及相关库时整理文章后,模拟实现的玩具版koa。配合文章做验证使用。
JavaScript
2
star
26

learn-use-gitbook

CSS
2
star
27

git-demos

A demo to learn git deeply.
Python
2
star
28

vuepress-plugin-viewer

Vue
1
star
29

passages

Run step by step
CSS
1
star
30

learn-nodejs

nodejs训练
JavaScript
1
star
31

udacity-ud120

🤖 优达学城 机器学习入门课程
Python
1
star
32

Magic-Square

算法实验大作业:幻方生成和数目求解。时间:2017-12-13。小组:杨汇琛、董沅鑫、刘婉玲
C++
1
star
33

diy-promise

JavaScript
1
star
34

filetree-displayer

清晰地画出目录结构图 | Clearly draw the catalog structure
Python
1
star
35

react16-demo

JavaScript
1
star
36

font-design

我的前端设计学习仓库
JavaScript
1
star
37

wechat

💬 我的个人公众号
JavaScript
1
star