yiliangyiyun-pc/vue.config.js

const path = require('path')

function resolve(dir) {
  return path.join(__dirname, dir)
}
/**
 * cdn 引入资源
 */
const cdn = {
  externals: {
    vue: 'Vue',
    'vue-router': 'VueRouter',
    vuex: 'Vuex',
    axios: 'axios',
    'element-ui': 'ELEMENT',
    'echarts': 'echarts',
    winseaview: 'winseaview',
    // 'base-template-lib': 'base-template-lib',
    // 'ali-oss': 'ali-oss',
    // 'lodash': 'lodash'
  },
  js: {
    dev: [
      "//cdn.bootcdn.net/ajax/libs/sockjs-client/1.5.0/sockjs.min.js",
      "//cdn.bootcdn.net/ajax/libs/stomp.js/2.3.3/stomp.min.js",
      "//cdn.bootcdn.net/ajax/libs/Sortable/1.9.0/Sortable.min.js"
    ],
    ship: [
      `./static/libs/sock.min.js`,
      `./static/libs/stomp.min.js`,
      `./cdn/Sortable/1.9.0/Sortable.min.js`,
      `./cdn/vue/2.6.10/vue.min.js`,
      `./cdn/vuex/3.1.1/vuex.min.js`,
      `./cdn/vue-router/3.0.1/vue-router.min.js`,
      `./cdn/axios/1.0.0/axios.min.js`,
      `./cdn/element-ui/2.12.0/index.js`,
      `./cdn/echarts/echarts.min.js`,
      `./cdn/lodash/4.17.20/lodash.min.js`,
      // `${process.env.BASE_URL}cdn/base-template-lib/base-template-lib.umd.min.js`,
      // `${process.env.BASE_URL}cdn/winseaview/winseaview.min.js`
    ],
    product: [
      "//cdn.bootcdn.net/ajax/libs/sockjs-client/1.5.0/sockjs.min.js",
      "//cdn.bootcdn.net/ajax/libs/stomp.js/2.3.3/stomp.min.js",
      "//cdn.bootcdn.net/ajax/libs/Sortable/1.9.0/Sortable.min.js",
      "//cdn.bootcdn.net/ajax/libs/vue/2.6.10/vue.min.js",
      "//cdn.bootcdn.net/ajax/libs/vuex/3.1.1/vuex.min.js",
      "//cdn.bootcdn.net/ajax/libs/vue-router/3.0.1/vue-router.min.js",
      "//cdn.bootcdn.net/ajax/libs/axios/0.21.0/axios.min.js",
      "//cdn.bootcdn.net/ajax/libs/element-ui/2.12.0/index.js",
      "//cdn.bootcdn.net/ajax/libs/echarts/4.8.0/echarts.min.js",
      // "//cdn.bootcdn.net/ajax/libs/lodash.js/4.17.20/lodash.min.js",
      // "//cdn.bootcdn.net/ajax/libs/ali-oss/6.11.2/aliyun-oss-sdk.min.js",
      // `/cdn/base-template-lib/base-template-lib.umd.min.js`,
      `/cdn/winseaview/winseaview.min.js`
    ]
  },
  css: {
    dev: [
      "/cdn/element-ui/2.13.2/theme-chalk/index.css",
      `./static/iconfont/iconfont.css`
    ],
    ship: [
      "/cdn/element-ui/2.13.2/theme-chalk/index.css",
      `./static/iconfont/iconfont.css`
    ],
    product: [
      `/cdn/winseaview/index.css`,
      "/cdn/element-ui/2.13.2/theme-chalk/index.css",
      `./static/iconfont/iconfont.css`
    ]
  }
}

const port = 9527 // dev port
const ignoreFile = ['production']
module.exports = {
  assetsDir: 'static',
  lintOnSave: true,
  publicPath: process.env.VUE_APP_PACKAGE_ENV === 'ship' ? '/' : './',
  productionSourceMap: false, //去掉 .map 文件
  // runtimeCompiler: true,
  // cssSourceMap: true,
  devServer: {
    port: port,
    disableHostCheck: true,
    open: false,
    overlay: {
      warnings: false,
      errors: true
    },
    proxy: {
      '/pb/bijiadan': {
        // target: 'http://127.0.0.1:4523/mock/349485',//目标地址
        target: 'http://192.168.24.5:8045',//目标地址
        // target: 'http://192.168.24.24:8089',//目标地址
        changeOrigin: true, //开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
        pathRewrite: {
          '^/pb/bijiadan': '/'
        }, //这里重写路径
        logLevel: 'debug',
      },
      '/pb/hs': {
        // target: 'http://127.0.0.1:4523/mock/349485',//目标地址
        target: 'http://192.168.24.24:8045',// 刘宪春本地目标地址
        // target: 'http://192.168.22.6:8020',//目标地址
        // target: 'http://192.168.24.24:8089',//目标地址
        changeOrigin: true, //开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
        pathRewrite: {
          '^/pb/hs': '/'
        }, //这里重写路径
        logLevel: 'debug',
      },
      '/pb/mock': {
        target: 'http://127.0.0.1:4523/mock/349485',//目标地址
        changeOrigin: true, //开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
        pathRewrite: {
          '^/pb/mock': '/'
        }, //这里重写路径
        logLevel: 'debug',
      },
      '/pb/apiFinance': {
        target: 'http://192.168.24.5:8098',//目标地址
        changeOrigin: true, //开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
        pathRewrite: {
          '^/pb/apiFinance': '/'
        }, //这里重写路径
        logLevel: 'debug',
      },
      '/pb/api': {
        // target: 'http://127.0.0.1:4523/mock/349485',//目标地址
        target: 'http://192.168.24.5:8098',//目标地址
        // target: 'http://192.168.24.24:8089',//目标地址
        changeOrigin: true, //开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
        pathRewrite: {
          '^/pb/api': '/'
        }, //这里重写路径
        logLevel: 'debug',
      },
      '/pb': {
        // target: 'https://product-server.winsea.com/', //目标地址
        // target: 'http://standard-dev.winsea.com/', //目标地址
        // target: 'http://localhost:8090/',
        target: 'http://192.168.1.110:8090/',
        // target: 'http://192.168.1.112:8090/',
        // target: 'http://192.168.1.121:8090/',
        // target: 'http://192.168.1.119:8090/',
        // target: 'http://192.168.24.5:8098',//目标地址
        // target: 'http://product-server.winsea.com/',
        // target: 'http://192.168.24.5:8098',//目标地址
        changeOrigin: true, //开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
        pathRewrite: { '^/pb': '/' }, //这里重写路径
        secure: false,
        logLevel: 'debug',
        // headers: {
        //   Referer: 'http://192.168.23.9:9527/',//'https://product-server.winsea.com/'
        // }
      },
    }
  },
  configureWebpack: (config) => {
    // provide the app's title in webpack's name field, so that
    // it can be accessed in index.html to inject the correct title.
    // if (debug) { // 开发环境配置
    //   config.devtool = 'source-map'
    // }
    //直接修改配置
    config.resolve.alias['@'] = resolve('src')
    config.resolve.alias['@/assets'] = resolve('src/assets')
    if (ignoreFile.includes(process.env.NODE_ENV)) {
      config.optimization.minimizer[0].options.terserOptions.compress.warnings = false
      config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true
      config.optimization.minimizer[0].options.terserOptions.compress.drop_debugger = true
      config.optimization.minimizer[0].options.terserOptions.compress.pure_funcs = ['console.log', 'console.info']
    }
  },
  chainWebpack(config) {
    config.plugins.delete('preload')
    config.plugins.delete('prefetch')
    config.output.chunkFilename('static/js/[name].[chunkhash].js').end()

    const entry = config.entry('app')
    entry.add('babel-polyfill').end()
    entry.add('classlist-polyfill').end()
    /* 添加分析工具 */
    if (process.env.NODE_ENV === 'production') {
      // config
      //   .plugin('webpack-bundle-analyzer')
      //   .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
      //   .end()
    }

    // entry.add('@/mock').end()
    //忽略的打包文件
    if (ignoreFile.includes(process.env.NODE_ENV)) {
      //忽略的打包文件
      config.externals(cdn.externals)
      //开启Gzip压缩
      config
        .plugin('gzip-plugin')
        .use('compression-webpack-plugin', [{
          filename: '[path].gz[query]',
          algorithm: 'gzip',
          test: /\.js$|\.html$|\.json$|\.css$|\.ttf$/,
          threshold: 10240, // 对超过10k的数据压缩
          minRatio: 0.8, // 只有压缩率小于这个值的资源才会被处理
          deleteOriginalAssets: false // 删除原文件
        }])
        .end()

    }
    config.plugin('html')
      .tap(args => {
        args[0].cdn = cdn
        return args
      })
    config.module.rule('images')
      .use('url-loader')
      .loader('url-loader')
      .tap(options => Object.assign(options, {
        esModule: false
      }))


    // set preserveWhitespace
    config.module
      .rule('vue')
      .use('vue-loader')
      .loader('vue-loader')
      .tap(options => {
        options.compilerOptions.preserveWhitespace = true
        return options
      })
      .end()

    config.when(process.env.NODE_ENV === 'development', config =>
      config.devtool('cheap-source-map')
      // config.devtool('source-map') // 源码-慢
    )

    config.when(process.env.NODE_ENV !== 'development', config => {
      // // 压缩代码
      config.optimization.minimize(true)
      config.optimization.splitChunks({
        chunks: 'all',
        cacheGroups: {
          libs: {
            name: 'chunk-libs',
            test: /[\\/]node_modules[\\/]/,
            priority: 10,
            chunks: 'initial' //只打包初始时依赖的第三方
          },
          // elementUI: {
          //   name: "chunk-elementUI", // 单独将 elementUI 拆包
          //   test: /[\\/]node_modules[\\/]element-ui[\\/]/,
          //   chunks: "all",
          //   priority: 3,
          //   reuseExistingChunk: true,
          //   enforce: true
          // },
          commons: {
            name: 'chunk-commons',
            test: resolve('src/components'), // 可自定义拓展你的规则
            minChunks: 3, //  最小共用次数
            priority: 5,
            reuseExistingChunk: true,
            minSize: 0,
            priority: 1,
            enforce: true
          }
        }
      })
      config.optimization.runtimeChunk('single')
    })
  }
}