webpack4如何构建一个项目基本配置

1.创建一个项目文件夹，可以使用 mkdir创建一个文件夹，然后是用cd进入项目目录，也可以首先建立一个文件夹，然后使用vscode打开文件夹，在terminal操作

2.使用npm init进行初始化项目，想要速度快一点的话安装cnpm，使用国内的淘宝镜像，加快开发速度。创建src（入口）目录，dist（出口）目录，webpack4中已经约定好输入输出目录，不再需要配置

3.本地安装webpack，webpack4中打包由新增的webpack-cli构成，所以一并安装，命令 npm -i webpack webpack-cli -D。

4.安装热更新webpack-dev-server，命令将第三步的包更改掉即可，在webpack.json中的script中加入 "dev":"webpack-dev-server --open chrome"，使用谷歌浏览器打开

5.安装 HtmlWebpackPlugin 插件，在webpack.config.js中进行配置， const HtmlWebpackPlugin = require('html-webpack-plugin');const Htmlplugin = new HtmlWebpackPlugin({ template:path.join(__dirname, './src/index.html'), filename: 'index.html'}) ，插件选项中加入 plugins: [Htmlplugin] ，mode选项根据需求设置为 development或production ，根据要求进行选择。