多项目配置

package.js

 "scripts": {
    "serve": "vue-cli-service serve",
    "build:pc": "vue-cli-service build pc",
    "build:m": "vue-cli-service build m",
    "lint": "eslint --fix --ext .js,.vue src"
  },

vue.config.js

// 代码压缩
const TerserPlugin = require('terser-webpack-plugin')
// gzip压缩
const CompressionPlugin = require('compression-webpack-plugin')
const webpack = require('webpack')
const path = require('path')
// var proEnv = require('./config/pro.env') // 生产环境
// var devEnv = require('./config/dev.env') // 本地环境
// 默认是本地环境
const env = process.env.NODE_ENV
let writeEnv = ''
if (env === 'production') { // 生产环境
  writeEnv = require('./config/pro.env') // 生产环境
} else { // 本地环境
  // 测试
  writeEnv = require('./config/dev.env') // 本地环境
}
function resolve(dir) {
  return path.join(__dirname, dir)
}

const HOST = '0.0.0.0'
const PORT = '8045'

// const DEV_URL = 'http://teamworkapi.mokingsoft.com';
// const DEV_URL = 'https://pmp.yangguangqicai.com/api'

// const pages = {
//   m: {
//     entry: 'src/pages/m/main.js',
//     template: 'public/m.html',
//     filename: 'index.html',
//     chunks: ['chunk-vendors', 'chunk-common', 'm']
//   },
//   pc: {
//     entry: 'src/pages/pc/main.js',
//     template: 'public/pc.html',
//     filename: 'index.html',
//     chunks: ['chunk-vendors', 'chunk-common', 'pc']
//   }

// }
const projectname = process.argv[3] // 获取build后面的参数确定执行哪个文件
function getEntry() {
  let entries = {}
  if (process.env.NODE_ENV == 'production') {
    entries = {
      index: {
        // page的入口
        entry: 'src/pages/'+projectname+'/main.js',
        // 模板来源
        template: `public/index.html`,
        // 在 dist/index.html 的输出
        // title: 'CIMS--'+projectName,
        filename: 'index.html',
        chunks: ['chunk-vendors', 'chunk-common', 'index']
      }
    }
  } else {
    let items = ['pc','m']
    for (let i in items) {
      const fileName=items[i];
      entries[fileName] = {
        entry: `src/pages/${fileName}/main.js`,
        // 模板来源
        template: `public/index.html`,
        // 在 dist/index.html 的输出
        filename: `${fileName}.html`,
        // title: 'CIMS--'+fileName,
        // 提取出来的通用 chunk 和 vendor chunk。
        chunks: ['chunk-vendors', 'chunk-common', fileName]
      }
    }
  }
  return entries
}

// let usedPage = {}
// const projectname = process.argv[3] // 获取build后面的参数确定执行哪个文件
// if (env == 'production') {
//   usedPage[projectname] = pages[projectname]
// } else {
//   usedPage = pages
// }
const usedPage=getEntry();
console.log(process);
module.exports = {
  //  测试   h5:   newcrm_page_h5test    newcrm_page_test
  publicPath: process.env.NODE_ENV === 'production' ? '/newcrm_page_h5/' : '/',
  // 正式    newcrm_page_h5    newcrm_page
  // publicPath: process.env.NODE_ENV === 'production' ? '/crm_page/' : '/',
  productionSourceMap: process.env.NODE_ENV !== 'production',
  pages: usedPage,
  outputDir: 'dist/' + projectname,
  // indexPath: 'index.html', // 指定生成的index.html输出路径
  css: {
    loaderOptions: {
      less: {
        modifyVars: {
          blue: '#3a82f8',
          'text-color': '#333'
        },
        javascriptEnabled: true
      }
    }
  },

  devServer: {
    host: HOST,
    port: PORT,
    proxy: {
      // 配置跨域
      '/api': {
        // 要访问的跨域的api的域名
        target: `${writeEnv.hosturl}/`,
        ws: true,
        changOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      },
    }
  },
  configureWebpack: config => {
    if (process.env.NODE_ENV === 'production') {
      // 为生产环境修改配置
      config.plugins.push(
        new TerserPlugin({
          // parallel:true,// 使用多进程并行运行来提高构建速度。默认并发运行数:os.cpus().length - 1。
          terserOptions: {
            ie8: true,
            compress: {
              drop_debugger: true,
              drop_console: true // 生产环境自动删除console
            },
            warnings: false
          }
        }),
        new CompressionPlugin({
          // gzip压缩配置
          test: /\.js$|\.html$|\.css/, // 匹配文件名
          threshold: 10240, // 对超过10kb的数据进行压缩
          deleteOriginalAssets: false, // 是否删除原文件
          algorithm: 'gzip',
          minRatio: 0.8
        }),
        // 可能中英文翻译有问题关注这个设置
        // 提取 monent 有效部分,减小体积。压缩前 611k->163k
        // en-gb 英国 en-us 美国(默认值) vi 越南 zh-cn 中国
        new webpack.ContextReplacementPlugin(
          /moment[\/\\]locale$/,
          /^\.\/(zh-cn|en-us|vi)$/i
        ) // 在vue工程中,在引入moment时,发现build之后的包比不引入moment的包文件大了整整两百多kb,后来发现webpack会把moment的语言包也一起打包
      )
    } else {
      // config.devtool = 'source-map';
      // config.devtool = false;
    }
    config.resolve = {
      extensions: ['.js', '.vue', '.json', '.css'],
      alias: {
        vue$: 'vue/dist/vue.esm.js',
        '@': resolve('src'),
        assets: resolve('src/assets'),
        components: resolve('src/components')
      }
    }
  },
  lintOnSave: false,
  chainWebpack: config => {
    // config.module.rules.delete('svg')
    config.module
      .rule('iview')
      .test(/\.js$/)
      .use('babel')
      .loader('babel-loader')
      .end() // 此处是添加内容重点
    config.resolve.alias.set('@', resolve('src'))
  }
}

你可能感兴趣的:(多项目配置)