webpack之entry和output

最近在学习webpack的相关知识，无奈学了就忘，遂在此做一个简单的记录，以便来日遗忘之时，可以回顾。

一.entry

webpack的entry有两种写法（好像还有一种是函数?这里就写两种把）。第一种是字符串，第二种是数组。
直接看例子：

let base1='./app/index2.js'

let base2={
    index: "./app/index.js",
    index1: "./app/index1.js"
}

module.exports={
    entry: base2,   //base1
    output: {
        path: __dirname+'/dist',   //path为输出路径，__dirname为根目录
        filename: "_[name].js"
    }
}

当以数组向entry传参数的时候，output得到的文件名字为_index.js和_index1.js，传入数组的情况通常用在有多个页面的情况下每个页面都要有一个压缩的js，此时就需要用到数组传递参数；
而当以字符串向entry传参数的时候，output得到的文件名字为_main.js（在不指定filename的情况下，此为默认值）。

webpack-entry官方中文文档传送门

二.output

output用来配置压缩后的文件名字和文件目录，直接看例子吧：

let base={
    index: './app/index.js',
    index1: './app/index1.js'
}

module.exports={
    entry: base,
    output: {
        path: __dirname+'./dist',
        //hashDigestLength: 4,
        filename: "[chunkhash:4]_[name].js"
    },
}

• [chunkhash] 和 [hash]
  [chunkhash:4]表示输出一个由字母和数字组成的4位的字符串，所以最后得到的结果可能是abc1_index.js、def2_.index1.js
  hashDigestLength: 4是另一种写法
  若filename指定[hash]_[name]则会输出abc1_index.js和abc1_index1.js这两个文件的hash值是相同的
  这是为什么呢？hash时webpack在整个编译过程中产生的一个值，而chunkhash指的是webpack在对每一个文件（这里指index1.js和index.js）编译过程，这两个的chunkhash是不同的