webpack

webpack介绍

  webpack是一个资源的打包工具，可以将.js,.css,.image等静态资源当做一个模块来进行打包，那么每一种模块都有一个对应的loader来实现。

webpack官网

webpack资源链接

  webpack的官网地址为：

• webpack

  官方文档地址：

• webpack doc

webpack官网示例

  webpack的官网示例非常简洁而漂亮，这里我就直接将其截图过来。

安装webpack

当前使用的版本

  由于不同版本间的差异问题，为了尽量避免采坑，所以这里暂时选用我比较熟知的webpack的1.14.0版本，置于现在的最新版本，其webpack的版本号为v4.25.1可见两者之间差距还是比较大的，因而我会在以后闲暇时间将当前文档中的1.14.0版本同步到4.x版本级别。

安装环境搭建

安装Node.js

  由于webpack属于Node.js的第三方依赖包，因而我们在使用webpack之前，我们需要在本地安装Node.js软件。

  该软件的安装方法比较简单，但是我还是写了一个安装的教程，如下;

• Node.js的下载与安装

安装nrm——国内淘宝镜像源

  由于我们位于国内的原因，所以在访问webpack时可能会遭遇网络问题，因而需要我们配置本地的淘宝镜像源地址，在这里我们通过nrm来配置国内的淘宝镜像源，其安装配置方式我之前也有写到，如下：

• Node.js安装nrm——国内淘宝镜像源的使用

安装webpack

  由于我们需要在其它地方也是用webpack，因而我们此处的webpack选择的是全局安装，其安装webpack指令如下：

cnpm install webpack@1.14.0 -g

  安装后的结果：

  查看当前安装的webpack版本号：