入门webpack(二)webpack概论

1.webpack是什么?

A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows to load parts for the application on demand. Through “loaders,” modules can be CommonJs, AMD, ES6 modules, CSS, Images, JSON, Coffeescript, LESS, … and your custom stuff.

从官网(github)上的描述可以看到webpack可以将众多模块打包成很少的的资源,将代码分割成细小的部分这样使应用程序按需要加载代码块。通过loader,webpack可以处理的模块有很多,AMD定义的模块,CommonJS,CSS,Images,SCSS等以及自定义模块。

webpack自身只能处理js文件,处理非js模块时需要通过loaders来处理。loaders是什么,后面会介绍。

从上面的介绍中,我们可以看到webpack主要是一个前端资源加载和打包工具,在模块化开发成为主流的今天,他能够将复杂项目中的各个模块按照一定的规则打包成细小的chunk(代码块)。并且可以删除模块中没有用到的代码。

2.为什么需要webpack

  • 复杂的项目涉及到很多模块,如果一个模块化开发的项目不经过打包处理,应用是无法工作的,比如项目中使用CSS预处理语言SCSS编写样式,使用了AMD规范,使用了TypeScript那么浏览器是无法识别的,只有打包编译后生成的文件浏览器才能编译运行在客户端。
  • 打包工具的出现使得模块化开发更加方便,打包后生成的静态资源体积更小,加载运行速度更快。
  • 使代码可以按需要加载

3.怎么做

你需要学习webpack,了解掌握并熟练!

猜你喜欢

转载自blog.csdn.net/tyrionj/article/details/79255744