Koa结合webpack实现自动刷新

在我们开发的过程中，我们会使用webpack-dev-server实现自动刷新，webpack-dev-server会把编译后的文件全部保存在内存里，而不会写入到文件目录内。但当我们的开发是前端(React)和后端(Koa)在一个项目里的时候就不行了，需要分开编译。

创建工程

mkdir koaDemo
cd koaDemo
#-y表示使用默认配置初始化
npm init -y

安装koa相关依赖

npm install koa koa-static koa-webpack -save

安装webpack相关依赖

npm install webpack webpack-cli --save-dev

项目根目录增加webpack.config.js配置文件

const path = require('path')
const webpack = require('webpack')

module.exports = {
    entry: {
        main: ['./src/main.js']
    },
    mode: 'development',
    output: {
        path: path.resolve(__dirname, 'public'),
        filename: 'js/[name].js',
        publicPath: '/'
    },
    resolve: {
        extensions: ['.js']
    }
}