1. webpack4概述

2. 入口和出口配置

3. 模式选择

4. loader

5. plugins

React Redux ES6 ...... 更多干货在个人主页中查看

webpack的4个基本点已经清楚了，列几个其他比较重要的配置项

devtool

开发工具，名如其义，供项目开发时使用的，生产时注释

语法

devtool: 'inline-source-map'

打包后的js不易阅读，而且也不知道是哪个js打包过来的代码，总之报错后不易定位。

配置 inline-source-map 工具后，报错会指定错误位置和文件

devServe

devServe可以提供个本地服务器，并实现代码修改后自动打包，web自动刷新

1 . 安装

cnpm install webpack-dev-server --save-dev

2 . 配置

//这里安装后不需要引入
devServer: { contentBase: './dist' }

创建一个本地服务器，通过 localhost:8080 访问，contentBase 指服务器根目录

3. 配置快速启动

为了方便在命令行里快速启动服务器，配置个启动脚本

//package.json 
"scripts": {"start": "webpack-dev-server --open"}

配置好后使用 npm start 即可启动服务器

到此 webpack 配置结束，后续有需要再介绍，下篇：热加载

【关注一下不迷路】 html css html css webpack javascript html webpack javascript css javascript css webpack