浅谈webpack 四个核心概念之Entry

module.exports = {
     entry: './path/to/my/entry/file.js'
  };

function require(/* ... */) {
     const module = { exports: {} };
     ((module, exports) => {`请输入代码`
     // 模块代码在这。在这个例子中，定义了一个函数。
      function someFunc() {}
      exports = someFunc;//也就是说你单独给exports赋值时候exports不属于module了是一个单独的变量
    // 此时，exports 不再是一个 module.exports 的快捷方式，
    // 且这个模块依然导出一个空的默认对象。
      module.exports = someFunc;//这里导出的函数是挂在module里的所以会被导入
    // 此时，该模块导出 someFunc，而不是默认对象。
   })(module, module.exports);
   return module.exports;//这里是这句话的解释 （最终返回给调用的是module.exports而不是exports）
  }

  entry: './app/to/my/entry/file.js'
  entry：{ main:"'./app/to/my/entry/file.js'"}

  entry：['./app/entry1', './app/entry2']

entry：{ a: './app/entry-a', b: ['./app/entry-b1', './app/entry-b2']}

const path = require("path");
const webpack = require("webpack");
const packagejson = require("./package.json");
const config = {
entry: {
  first: './src/first.js',//引入了common.j和vue.js
  second: './src/second.js',//引入了common.j和vue.js
  vendor: Object.keys(packagejson.dependencies)//获取生产环境依赖库的
  //模块名称，返回一个数组，这里涉及的是单入口数组写法将多个依赖合并到一个chunk中
  //在这里vue作为第三方库会被合并
},
output: {
  path: path.resolve(__dirname,'./dist'),
  filename: '[name].js'
},
plugins: [
  new webpack.optimize.CommonsChunkPlugin({
    name: 'vendor',//指定已经存在的chunk这里指向的是vendor，
    公共部分模块都会合并到这个chunk名对应的文件，不指定默认生成name为commons的chunk。
    filename: '[name].js'//抽离出公共部分的文件名
  }),
]
}

module.exports = config;

plugins: [//这一步把webpack运行文件抽离出来
    new webpack.optimize.CommonsChunkPlugin({//先抽离所用的公共模块
      name: 'vendor',
      filename: '[name].js'
    }),
    new webpack.optimize.CommonsChunkPlugin({//再指定vendor从中抽离webpack运行文件
      name: 'runtime',
      filename: '[name].js',
      chunks: ['vendor']
    }),
     new webpack.optimize.CommonsChunkPlugin({
    name: ['vendor','runtime'],
    filename: '[name].js',
    minChunks: Infinity//只有当入口文件（entry chunks） >= 3 才生效，
    //用来在第三方库中分离自定义的公共模块
    }),
    new webpack.optimize.CommonsChunkPlugin({
    name: 'common',
    filename: '[name].js',
    minChunks:2,//默认为2，意思是模块被多少个chunk引用才被抽离
    //由于common被 first 和second 引用 所以会被抽离
    chunks: ['first','second']//从first.js和second.js中抽取commons chunk
    }),
  ]