美文网首页
vue3.0直接打包成zip压缩文件

vue3.0直接打包成zip压缩文件

作者: 勾起一抹笑容 | 来源:发表于2022-08-25 10:59 被阅读0次

    安装filemanager-webpack-plugin包

    -npm install filemanager-webpack-plugin@2.0.5 -D

    在vue.config.js添加如下代码

    -"use strict";
    const webpack = require("webpack");
    const StatsPlugin = require("stats-webpack-plugin");
    const isDev = process.env.NODE_ENV === "development";

    const { BundleAnalyzerPlugin } = require("webpack-bundle-analyzer");
    let plugins = [new StatsPlugin("manifest.json", {
    chunkModules: false,
    entrypoints: true,
    logging: false,
    source: false,
    chunks: false,
    modules: false,
    assets: false,
    children: false,
    chunkGroups: false,
    outputPath: false,
    exclude: [/node_modules/]
    }),
    new webpack.DllReferencePlugin({
    //公共模块axios,moment
    manifest: require("./dll/common_manifest.json"),
    context: __dirname
    }),
    new webpack.DllReferencePlugin({
    //vue,vue-router,vuex
    manifest: require("./dll/vue_manifest.json"),
    context: __dirname
    }),];

    if (!isDev) {
    const FileManagerPlugin = require("filemanager-webpack-plugin");
    plugins = [...plugins, new BundleAnalyzerPlugin({
    // 查看打包大小
    // analyzerMode: isDev ? "disabled" : "server"
    analyzerMode: "disabled"
    }),
    //filemanager-webpack-plugin2.0.5写法
    new FileManagerPlugin({
    onEnd: {
    delete: [./dist.zip],
    archive: [
    {
    source: ./dist,
    destination: ./dist.zip
    }
    ]
    }
    })

    //filemanager-webpack-plugin4.0写法
    new FileManagerPlugin({
    onEnd: {
    events: {
    onEnd: {
    delete: [./dist.zip],
    archive: [
    {
    source: ./dist,
    destination: ./dist.zip
    }
    ]
    }
    }
    }
    })

    ]
    }
    module.exports = {
    publicPath: isDev ? http://localhost:${process.env.VUE_APP_PORT}/ : /${process.env.VUE_APP_PathPUBLICPATH}/,
    configureWebpack: {
    output: {
    libraryTarget: "umd",
    library: process.env.VUE_APP_PathPUBLICPATH
    },
    plugins
    },
    devServer: {
    port: parseInt(process.env.VUE_APP_PORT),
    open: false,
    historyApiFallback: true,
    overlay: {
    warnings: false,
    errors: true
    },
    headers: {
    "Access-Control-Allow-Origin": "*"
    },
    proxy: {
    "/main_api": {
    target: http://172.16.41.26:7700,
    // target: http://172.18.108.75:7700,
    pathRewrite: {
    "^/main_api": "/"
    }
    }
    }
    },
    css: {
    loaderOptions: {
    less: {
    modifyVars: {
    //在此处设置,也可以设置直角、边框色、字体大小等
    "layout-header-background": "#283040", //左侧背景
    "menu-item-height": "48px", //菜单高度
    "menu-dark-submenu-bg": "#2E394C", //子菜单颜色
    "menu-inline-toplevel-item-height": "48px" //菜单高度
    },
    javascriptEnabled: true
    }
    }
    },
    productionSourceMap: isDev
    };

    参考文档地址:http://t.zoukankan.com/dubayaoyao-p-14542913.html

    相关文章

      网友评论

          本文标题:vue3.0直接打包成zip压缩文件

          本文链接:https://www.haomeiwen.com/subject/smytnrtx.html