webpack使用的一些见解

    最近在使用webpack来做为前端开发的自动构建工具，对webpack有一些理解，这里跟你们分享一下。

    1、为何要用webpack

    一开始是处于好奇和学习的心态，可是在了解和学习的过程当中发现，做为一个前端开发，由于下面的这几点，我以为仍是颇有必要的。

    1.webpack 可以把amd cmd和原生的js模块打包到一块儿，像这样的工具在前端混乱时代里面是一个不错的选择。

    2.webpack 可以把css image html等打包成js，就这个功能，对于实现组件化 模块化的前端开发也是一个很不错的选择，也许你会以为不少方法均可以实现，可是我以为没有这个那么的轻松。

    3.webpack 可以编译less sass coffee  等css js这些预编译语言，可以进行css js image压缩，生成hash值来做为版本区分，这个绝对是生产环境的好助手，由于这个解决了生产环境下代码解析、更新缓存等问题。

    4.webpack 对于reactjs的用户来讲，简直是神通常的搭档，为何？由于基于上面的三点，并且jsx的解析和es6的应用都是让你着迷的地方。

 

    2、何时用webpack

    webpack并非全部的场景都适合，从资料和这段时间的摸索来看，场景的应用能够分为下面的状况：

    1.单页面应用(spa)应该是比较合适的场景，由于webpack主张把全部东西打包一块儿，对于一个单页面应用来讲这是再合适不错了。并且你发现不少网上的关于webpack的距离基本的例子都是打包成一个文件，一个或多个入口却只有一个出口。网上的例子不少，这里就再也不举例了。

    2.react相关的应用，包括reactjs、 react native这些，不管是从组件化开发，仍是打包编译，webpack都是最佳的选择。

    3.移动端网页开发，用这个也是不错的选择，移动端网页开发通常偏向于简约，组件化，这个都是webpack轻松作到的，还有就是在移动端静态文件缓存比较严重，而webpack中文件添加hash的功能能够解决这个事情。

    值得注意的是：在一些中大型的电商网站，页面结构比较复杂的网站，webpack的选择须要慎重，由于考虑到版本切换、灰度发布等功能，webpack处理起来并非那么的合适，这些状况下能够结合gulp  grunt这来来用。因此使用是要分状况的而不是一味的由于你们用而用。

 

    3、webpack 须要注意的问题

    1.webpack 能根据配置来自动加载模块，可是不能自动安装须要的模块，也不是内置了你须要的模块，好比 jsx-loader，不是内置的，webpack也不会自动帮你安装，须要你本身执行 " npm i jsx-loader " 命令来安装。

    2.webpack 目前是不能处理雪碧图的，估计是做者的初衷是打包一切，而不是分散处理。因此要处理雪碧图这样的需求要用其余的方法。

    3. webpack 在watch状态下是不可以监听新增文件的，本人用的1.13.0版本是没有实现这个功能的，若是要实现估计仍是找一下其余的插件或者方法，可是针对webpack自己来讲是没有这个功能的，不过能够考虑跟gulp grunt这些结合使用。

    4.webpack 在watch状态下回随着文件修改并且内存增长，这点好像是不少人都知道的，而解决的方式是用gulp来监听，不知道还有没有其余的方法，或者以后webpack会不会改善这些。