webpack---devServer

依赖：webpack-dev-server
devServer：开发服务器（自动编译、自动打开浏览器、自动刷新浏览器）
指令： npx webpack-dev-server
特点：只会在内存中编译打包，不会有任何输出

devServer: {
    // 指定运行代码的目录，一般也是所有资源的输出目录
    contentBase: resolve(__dirname, 'dist'),
    // 监视contentBase目录下所有文件，一旦发生变化就reload
    watchContentBase: true,
    watchOptions: {
        // 让监视更高效
        ignored: /node_modules/
    },

    // 启动gzip压缩
    compress: true,

    // 指定域名、端口
    host: 'localhost',
    port: 5000,

    // 自动打开默认浏览器
    open: true,

    // 开启HMR功能
    hot: true,
        
    // 让屏幕和编辑器更整洁
    // 不要显示启动服务器日志信息
    clientLogLevel: 'none',
    // 除了一些基本的启动信息外其他内容都不要显示
    quiet: true,
    // 如果出错不要全屏提示
    overlay: false,

    // 解决开发环境跨域问题
    proxy: {
        '/api': {
            // 一旦devServer服务器接受到'/api/xxx'的请求，就会把请求转发到'http://xxx:3000'
            target: 'http://xxx:3000',
            // 把'/api/xxx'重写成'/xxx'
            pathRewrite: {
                '^/api': ''
            }
        }
    }
}