关于webpack Error: listen EADDRINUSE: address already in use 127.0.0.1:3000解决

       这次开贴继续分享小问题的解决记录,这次在学习webpack的devServer中遇到了一个小问题,问题发生的过程我自己也大致捋了一下:首先,自己开了一个文件,专门为devServer配置练习,配置成功后并打开了浏览器(localhost:3000)实现了代码实时更新,实时打包,用完后关闭了浏览器的这个页面(localhost:3000);当自己又开启另外一个文件也配置了devServer,引入更多loader对其他资源进行打包操作时,此时使用npx webpack-dev-server开启浏览器时就出现以下问题:

这个问题其实说明了你的webpack.config.js中devServer配置的端口号:3000(port:3000)被一直占用了:

module.exports = {
  ......
    devServer: {
        contentBase: resolve(__dirname, 'build'),
        compress: true,
        port: 3000,  
        open: true
    }
 ......
}

解决思路和方法:需要将一直被占用的端口号:3000 kill掉,这样就可以使用这个端口号了.首先打开CMD(Mac中打开终端),在命令行内输入:netstat -ano(Mac中输入: lsof -i tcp:port):

找到port3000对应的进程号(我这是17044),在命令行内输入:tskill 17044   (Mac中sudo kill  Pid号)

回到vscode中terminal输入npx webpack-dev-server 此次可以正常使用端口号3000,并自动打开浏览器实时更新自己写代码的状态了: