第一天 8/4

两种安装方式

1.npm install webpack@版本 webpack-cli -g 全局安装

2.npm install webpack@版本 webpack-cli -D 局部安装

常用帮助命令

npm info webpack 查看目前所有webpack版本
npm uninstall webpack@版本 webpack-cli -D 删除webpack
npx webpack --config 配置文件(webpack.config.js)   默认webpack.config.js
npx webpack index.js  
npx执行当前项目内的webpack配置如果项目不存在会查找全局的
如局部安装webpack 执行webpack -v 会提示未安装  npx webpack -v会返回版本号

1.webpack是什么

webpack是一个模块打包工具

以下浏览其直接执行会报错 webpack可将以下语句翻译成浏览器认识的语法并打包出来（此时的理解）

2.webpack的配置文件

2.1 默认配置文件

npx webpack index.js 此方法会执行webpack是因为webpack有默认配置文件

2.2 自定义配置文件

webpack.config.js 自定义时会执行此文件

const path = require('path')
module.exports = {
    entry: './src/index.js',
    output:{
        filename: 'main.js',
        path:path.resolve(__dirname, 'dist')
    }
}

2.3 配置便捷命令

第二天 8/5

3.浅谈webpack打包输出内容

3.1 mode

1. development 开发模式 打包不压缩
2. production  生产模式 打包压缩

3.2 输出浅谈

hash：唯一标识
version: 版本号
time: 打包时间
asset：打包输出文件
size: 文件大小
chunks: 打包入口js以及相关js的标识符
chukNames: 打包文件以及相关文件的入口名称