Support configuring response headers for development environment server

[myth929]

背景：微前端子应用跨域配置失败 环境：

• @micro-zoe/micro-app: 1.0.0-rc.4
• vite: 3.2.5 改动：取vite.config中的server.headers设置为返回headers

[changeset-bot[bot]]

⚠️ No Changeset found

Latest commit: fdccf57da9a42fbd699e0bc8af1d881b2d5f01b4

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[emosheeep]

By the way, could you please show me your vite.config.ts?

[myth929]

This is our vite.config. I will resubmit the code later.

import path from 'path';
import {defineConfig, loadEnv} from 'vite';
import vue2 from '@vitejs/plugin-vue2';
import createExternal from 'vite-plugin-external';
import vueJsx from '@vitejs/plugin-vue2-jsx';
import {createMpaPlugin, createPages} from 'vite-plugin-virtual-mpa';
import http2 from './plugins/vite-plugin-http2';
import mockPlugin from './plugins/vite-plugin-mock';

function resolve(dir) {
    return path.join(__dirname, dir);
}

const proxyApiConfig = require(path.resolve(__dirname, './conf.js'));

const pages = createPages([
    {
        name: 'login',
        filename: 'login/index.html',
        entry: '/src/login/main.js',
        data: {
            title: 'title1',
            type: 'type1'
        }
    },
    {
        name: 'main',
        filename: 'main/index.html',
        entry: '/src/main/main.js',
        data: {
            title: 'title2',
            type: 'type2'
        }
    }
]);

export default ({mode}) => {
    const env = loadEnv(mode, process.cwd());
    const VITE_BASE_URL = env.VITE_BASE_URL;

    const server = {
        // 是否开启 https
        https: true,
        // 端口号
        port: 8080,
        // 监听所有地址
        host: '0.0.0.0',
        // 服务启动时自动打开浏览器
        open: '/main/index.html?ed',
        headers: {
            'Access-Control-Allow-Origin': '*'
        },
        hmr: {
            overlay: false
        }
    };

    process.env = {...process.env, env};

    return defineConfig({
        base: VITE_BASE_URL,
        envPrefix: 'VUE_APP_',
        define: {
            'process.env': process.env
        },
        plugins: [
            mockPlugin({
                mockPathRegExp: /^\/abc\/data\/|^\/data\//
            }),
            http2({
                proxy: {
                    '^/abc/data/': Object.assign({
                        async onReq(req, options) {
                            options.headers = Object.assign(options.headers, proxyApiConfig.headers);
                        }
                    }, proxyApiConfig.proxy.abc || {}),
                    '^/data/': Object.assign({
                        async onReq(req, options) {
                            options.headers = Object.assign(options.headers, proxyApiConfig.headers);
                        }
                    }, proxyApiConfig.proxy.main || {})
                }
            }),
            createExternal({
                externals: {
                    'monitor-sdk': 'monitor'
                }
            }),
            vueJsx(
                {
                    include: /(\.[jt]sx$)|(\/main\.js)/
                }
            ),
            vue2(),
            createMpaPlugin({
                template: 'src/template.html',
                /**
                 * You can write directly or use `createPages` function independently outside and then pass it to this field.
                 * Both of the above can enjoy type hints.
                 */
                pages
            })
        ],
        optimizeDeps: {
            exclude: ['mockup', 'less-plugin-est'],
            include: ['qs', 'axios', 'url-parse', 'graphql']
        },
        resolve: {
            extensions: ['.mjs', '.js', '.json', '.vue'],
            modules: [ // 指定以下目录寻找第三方模块，避免webpack往父级目录递归搜索
                resolve('src'),
                resolve('node_modules')
            ],
            include: ['menu-vue']
        },
        css: {
            preprocessorOptions: {
                less: {
                    charset: false,
                    additionalData: '@import "/src/common/css/common.less";',
                    math: 'always',
                    javascriptEnabled: true
                }
            }
        },
        server,
        build: {
            // 设置最终构建的浏览器兼容目标
            target: 'es2015',
            // 构建后是否生成 source map 文件
            sourcemap: false,
            //  chunk 大小警告的限制（以 kbs 为单位）
            chunkSizeWarningLimit: 2000,
            // 启用/禁用 gzip 压缩大小报告
            reportCompressedSize: false,
            commonjsOptions: {
                transformMixedEsModules: true
            }
        }
    });
};

[emosheeep]

A new version has been published, you can have a try.