美文网首页
vue.config多页配置

vue.config多页配置

作者: 小小烦恼 | 来源:发表于2020-04-01 16:54 被阅读0次

const CompressionWebpackPlugin = require('compression-webpack-plugin')
const path = require('path');
const glob = require('glob');
const fs = require('fs')

// 是否使用gzip
const productionGzip = true;
// 需要gzip压缩的文件后缀
const productionGzipExtensions = ['js', 'css'];
// CDN外链,会插入到index.html中

// 统一配置多页
function muliti() {
    const pages = {};
    glob.sync('./src/entries/**/main.js').forEach(path => {
        const chunk = path.split('./src/entries/')[1].split('/main.js')[0];//设置名称
        pages[chunk] = {
            entry: `src/entries/${chunk}/main.js`,
            template: `public/${chunk}.html`,
            filename: `${chunk}.html`,
            chunks: ['chunk-common', `${chunk}`]
        }

    });
    console.log('构建开始啦......................');
    return pages
}


module.exports = {
    // baseUrl: './', // 基本路径
    outputDir: 'dist', // 输出文件目录
    lintOnSave: false,
    pages: muliti(),
    // 配置merge
    configureWebpack: config => {
        //开启vs-code Debugger for Chrome
        config.devtool = 'source-map';
        config.optimization = {
            splitChunks: {
                cacheGroups: {
                    vendor: {
                        test: /[\\/]node_modules[\\/]/,
                        name(module) {
                            // get the name. E.g. node_modules/packageName/not/this/part.js
                            // or node_modules/packageName
                            const packageName = module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1];
                            // npm package names are URL-safe, but some servers don't like @ symbols
                            return `fanwenqiang.${packageName.replace('@', '')}`;
                        }
                    },
                }
            }
        };
        //Gzip压缩
    },
    runtimeCompiler: true,
    productionSourceMap: false, // 生产环境是否生成 sourceMap 文件
    devServer: {
        open: process.platform === 'darwin',
        host: '0.0.0.0',
        port: 9998,
        https: false,
        hotOnly: false,
        proxy: {
            '/a_api/*': {
                target: 'http://xxxx:4056/',
                changeOrigin: true,
                secure: false
            },
            '/arcgis/*': {
                target: 'http://xxxx:6080',
                changeOrigin: true,
                secure: false
            },
        }, // 设置代理
        before: app => { }
    },
    // 第三方插件配置
    pluginOptions: {}
};

相关文章

  • vue.config多页配置

  • 无标题文章

    --- type: api --- ## 全局配置 `Vue.config` 是一个对象,包含 Vue 的全局配置...

  • Vue-cli3 + Webpack 4 打包优化

    配置生产环境不产生sourceMap和去除Degugger 以及 console Vue.config配置下写...

  • 20200816

    Vue全局API汇总 全局配置 Vue.config 是全局配置对象。 silent 默认false,是否取消Vu...

  • 打包优化去掉console.log,webpack.js配置排除

    一、打包优化去掉console.log 在vue.config中,配置: chainWebpack(config)...

  • webpack4构建多页应用,了解一下

    用webpack构建多页应用可以有2种思路,多页面单配置 vs. 多页面多配置。本例子采用多页面单配置,即在单页应...

  • Vue.config全局配置

    1.取消 Vue所有的日志与警告。 2.Vue自定义键名 3.设置为false以阻止 vue 在启动时生成生产提示

  • vue多页配置

    人生就像一列开往坟墓的列车,路途上会有很多站,很难有人至始至终陪你走完全程,当陪你的人要下车时,即便不舍,也要心存...

  • webpack4 构建vue多页工程

    webpack4 构建vue多页工程 多页应用开发环境配置 构建开发环境的配置,需要使用到webpack-dev-...

  • vue-全局配置

    Vue.config是一个对象,包含 Vue 的全局配置。可以在启动应用之前修改下列属性: silent 类型:b...

网友评论

      本文标题:vue.config多页配置

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