vue-cli4打包(vue.config.js)自定义复制哪些文件到打包后的文件夹中

我维护的一个多入口多出口的项目,每个出口文件夹中的html都有同级的config.js文件,其中记录一些配置信息,可以如下配置vue.config.js,为每一个html输出指定config.js

// @vue/cli配置文档https://cli.vuejs.org/zh/config/#vue-config-js
module.exports = {
    
    
        ...
        // webpack-plugin-copy
        config.plugin("copy").tap(() => {
    
    
            const arr = [[]];
            const copy = [
                {
    
     key: "page1", dir: "page1" },
                {
    
     key: "page2", dir: "page2" },
            ];
            for (let i of copy) {
    
    
                arr[0].push({
    
    
                    from: "public/config-plugin.js",
                    to: i.dir + "/config.js",
                    transform(content) {
    
    
                        // 在此处自定义 config-plugin.js 的内容
                        const modifiedContent = content
                            .toString()
                            .replace(/CUSTOM_VALUE/g, i.key);
                        return modifiedContent;
                    },
                });
                // 复制public文件夹下面的loading文件夹到各自页面文件下
                arr[0].push({
    
    
                    from: "public/loading",
                    to: i.dir + "/loading",
                });
            }
            // 复制public文件夹下面的favicon.ico到dist/favicon.ico
            arr[0].push({
    
    
                from: "public/favicon.ico",
                to: "favicon.ico",
            });
            return arr;
        });
    },
    pages: {
    
    
        // 大屏控制版本适配10560
        ddScreenControl: {
    
    
            entry: "src/main.js",
            template: "public/index.html",
            filename: "ddScreenControl/index.html",
        },
        // 大屏控制版本
        ddScreenControl9800: {
    
    
            entry: "src/main.js",
            template: "public/index.html",
            filename: "ddScreenControl9800/index.html",
        },
    },
};

猜你喜欢

转载自blog.csdn.net/qq_42611074/article/details/130829866