webpack的安装与配置

1.nmp install webpack -g

安装全局的webpack， -g即指全局安装，如出现权限错误则需要在命令前加上sudo

2.npm install webpack@1.15.0 --save-dev

在项目中安装webpack

3.webpack -v 查看版本号

两种方式配置webpack

1.1 在项目的page文件夹下建立index文件夹，在index文件夹下建立index.js和cats.js文件

1.2 index.js文件中配置以下信息，然后保存

cats = require('./cats.js');
console.log(cats);

 1.3 在cats文件中配置以下信息，然后保存

var cats = ['dave', 'henry', 'martha'];
module.exports = cats;

 1.4 在项目文件夹下运行命令

webpack ./src/page/index/index.js ./dist/app.js

2.1.在项目文件夹下建立webpack.config.js文件，在文件中建立以下信息

module.exports = {
    entry: './src/page/index/index.js',
    output: {
        path: './dist',
        filename: 'app.js'
    }
};

注：entry：js的入口文件

　　output：目标文件

　　externals：外部依赖的声明

　　resove：配置别名

　　module：各种文件，各种loader

　　plugins：插件

2.2.在项目文件夹下打开gitbash执行‘webpack’命令

问题：

1.为什么全局安装时不需要版本号，而在安装项目依赖时需要版本号

这和npm的加载原理相关，npm会优先使用项目本地的npm包，如果找不到才去全局的npm包里找，在全局安装中只是为了提供命令，而真正使用的是webpack@1.15.0的版本

2.为什么用webpack@1.15.0版本

因为2.x版本在正常浏览器中没有问题，但在IE8中会有问题，并且问题很难找出，和保留字有关，IE8惹不起还是躲一躲较好

3.什么是 --save-dev，为什么本地项目安装的时候要加 --save-dev

这是npm的另一个机制，他会把包的信息存放在package.json文件中，这样就可以记录项目的依赖