webpack学习（一）

一、名词解释

• bundle
  资源包，包含可执行程序，静态资源等
• chunk
  模块，小于完整程序的体积，方便 验证、调试、测试，提供了可靠的封装和抽象。

二、概念

通过一个或多个入口构建 依赖图（dependency graph），然后将项目中的 chunk 组合成一个或多个 bundle 。

核心概念：

1. entry（入口）：打包的起点文件

默认：./src/index.js
可在 webpack configuration 中单独配置

-- webpack.config.js --

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

2. output（输出）：打包 bundle 的存储路径及命名方式

默认主文件：./dist/main.js
默认其他文件：./dist

-- webpack.config.js --

module.exports={
    entry: './path/to/my/entry/file.js',
    output: {
        path: path.resole(__dirname, 'dist'),
        filename: 'my-first-webpack.bundle.js',
    },
}

3. loader