/* jshint esversion: 6 */
const vuxLoader = require('vux-loader');
const webpack = require('webpack');
const merge = require('webpack-merge');

module.exports = {
  // 基本路径
  publicPath: process.env.NODE_ENV === 'production' ? '/boh/' : '/',
  // 输出文件目录
  outputDir: 'dist',
  // 放置生成的静态资源的目录
  assetsDir: '',
  // 指定生成的 index.html 的输出路径 (相对于 outputDir)。也可以是一个绝对路径。
  indexPath: 'index.html',
  filenameHashing: true,
  pages: {
    index: {
      // page 的入口
      entry: 'src/main.js',
      // 模板来源
      template: 'public/index.html',
      // 在 dist/index.html 的输出
      filename: 'index.html',
      // 当使用 title 选项时，
      // template 中的 title 标签需要是 <title><%= htmlWebpackPlugin.options.title %></title>
      title: 'Index Page',
      // 在这个页面中包含的块，默认情况下会包含
      // 提取出来的通用 chunk 和 vendor chunk。
      chunks: ['chunk-vendors', 'chunk-common', 'index']
    },
    // 当使用只有入口的字符串格式时，
    // 模板会被推导为 `public/subpage.html`
    // 并且如果找不到的话，就回退到 `public/index.html`。
    // 输出文件名会被推导为 `subpage.html`。
    subpage: 'src/subpage/main.js'
  },
  // eslint-loader 是否在保存的时候检查
  lintOnSave: 'error',
  // 是否使用包含运行时编译器的 Vue 构建版本。设置为 true 后你就可以在 Vue 组件中使用 template 选项了。
  runtimeCompiler: true,
  // 生产环境是否生成 sourceMap 文件
  productionSourceMap: false,
  // vux 相关配置,使用vux-ui
  // 如果这个值是一个对象，则会通过 webpack-merge 合并到最终的配置中。
  // 如果这个值是一个函数，则会接收被解析的配置作为参数。该函数及可以修改配置并不返回任何东西，也可以返回一个被克隆或合并过的配置版本。
  configureWebpack: config => {
    vuxLoader.merge(config, {
      options: {},
      plugins: ['vux-ui']
    });
    merge(config, {
      plugins: [
        new webpack.ProvidePlugin({
          $: 'jquery',
          jQuery: 'jquery',
          '_': 'lodash',
          'axios': 'axios',
          'moment': 'moment'
        })
      ]
    });
    if (process.env.NODE_ENV === 'production') {
      // 为生产环境修改配置...
    } else {
      // 为开发环境修改配置...
      console.warn(merge);
    }
  },
  // configureWebpack: {
  //   plugins: [
  //     new webpack.ProvidePlugin({
  //       $: 'jquery',
  //       jQuery: 'jquery',
  //       '_': 'lodash',
  //       'axios': 'axios',
  //       'moment': 'moment'
  //     })
  //   ]
  // },
  // 是一个函数，会接收一个基于 webpack-chain 的 ChainableConfig 实例。允许对内部的 webpack 配置进行更细粒度的修改。
  chainWebpack: () => {},
  // css相关配置
  css: {
    // 是否使用css分离插件 ExtractTextPlugin
    // extract: true,
    // 开启 CSS source maps?
    sourceMap: false,
    // css预设器配置项
    loaderOptions: {
      css: {
        // 这里的选项会传递给 css-loader
      },
      postcss: {
        // 这里的选项会传递给 postcss-loader
      }
    },
    // 默认情况下，只有 *.module.[ext] 结尾的文件才会被视作 CSS Modules 模块。设置为 true 后你就可以去掉文件名中的 .module 并将所有的 *.(css|scss|sass|less|styl(us)?) 文件视为 CSS Modules 模块。
    modules: false
  },
  // use thread-loader for babel & TS in production build
  // enabled by default if the machine has more than 1 cores
  parallel: require('os').cpus().length > 1,
  // PWA 插件相关配置
  // see https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa
  pwa: {},
  // webpack-dev-server 相关配置
  devServer: {
    open: process.platform === 'darwin',
    host: '0.0.0.0',
    port: 8080,
    https: false,
    hotOnly: false,
    // 设置代理
    proxy: {
      'api': {
        filter: ['/op/', '/fi/', '/de/', '/st/', '/fr/', '/pr/', '/pu/', '/dl/', '/b/', '/t/', '/rpt/'],
        target: 'http://dev.kmlab.com/boh',
        // target: 'http://itomix-dev.kmlab.com/boh'
        changeOrigin: true,
        pathRewrite: {
          '^/(.*)': '/$1'
        },
        onProxyReq: function (proxyReq, req, res, options) {
          proxyReq.setHeader('X-Proxy-Host', req.header('host'));
          proxyReq.setHeader('X-Proxy-Request-URI', req.url);
        }
      }
    },
    before: app => {},
    overlay: {
      warnings: true,
      errors: true
    }
  },
  // 第三方插件配置
  pluginOptions: {
  // ...
  }
};