const path = require('path');
const config = require('./config');
const ManifestPlugin = require('webpack-manifest-plugin');
const LodashModuleReplacementPlugin = require('lodash-webpack-plugin');
const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
const webpack = require('webpack');

const jsSource = `./${config.sourcePath}/${config.jsDirectory}`;
const appRoot = path.resolve('./');
const entry = {
  main: [`${jsSource}/main.js`],
  sentry: [`${jsSource}/sentry.js`],
  styleguide: [`${jsSource}/styleguide/styleguide.jsx`],
  survey: [`${jsSource}/surveys/survey.js`],
  survey_admin: [`${jsSource}/surveys/survey-admin.js`],
  survey_results: [`${jsSource}/surveys/survey-results.jsx`],
  campaigns: [`${jsSource}/campaigns.js`],
  charts: [`${jsSource}/charts.js`],
  tinymce: [`${jsSource}/tinymce.js`],
  embed_course_stats: [`${jsSource}/embed_course_stats.js`],
};

module.exports = (env) => {
  const doHot = env.development && !env.watch_js;
  const mode = env.development ? 'development' : 'production';
  const outputPath = doHot
    ? path.resolve(appRoot, `${config.outputPath}/${config.jsDirectory}`)
    : path.resolve(`${config.outputPath}/${config.jsDirectory}`);

  return {
    mode,
    entry,
    output: {
      path: outputPath,
      filename: doHot ? '[name].js' : '[name].[chunkhash].js',
      publicPath: '/',
    },
    resolve: {
      extensions: ['.js', '.jsx'],
      symlinks: false
    },
    module: {
      rules: [
        {
          test: /\.jsx?$/,
          exclude: [/vendor/, /node_modules(?!\/striptags)/],
          use: {
            loader: 'babel-loader',
            query: {
              cacheDirectory: true,
            },
          },
        },
        {
          test: /\.jsx?$/,
          exclude: [/vendor/, /node_modules(?!\/striptags)/],
          loader: 'eslint-loader',
          options: {
            cache: true,
            failOnError: !!env.production
          },
        },
      ],
    },
    externals: {
      jquery: 'jQuery',
      'i18n-js': 'I18n',
    },
    plugins: [
      // manifest file
      new ManifestPlugin({
        fileName: 'js-manifest.json'
      }),
      // node environment
      new webpack.DefinePlugin({
        'process.env': {
          NODE_ENV: JSON.stringify(mode),
        },
      }),
      // Creates smaller Lodash builds by replacing feature sets of modules with noop,
      // identity, or simpler alternatives.
      new LodashModuleReplacementPlugin(config.requiredLodashFeatures),
      new MomentLocalesPlugin()
    ],
    optimization: {
      splitChunks: {
        chunks: chunk => !/tinymce|charts/.test(chunk.name),
        name: 'vendors'
      },
    },
    watch: env.watch_js,
    devtool: env.development ? 'eval' : 'source-map',
    stats: env.stats ? 'normal' : 'minimal',
  };
};


@@ -2590,24 +2590,136 @@
 itChunks: %7B%0A
+        cacheGroups: %7B%0A          vendors: %7B%0A            test: /%5B%5C%5C/%5Dnode_modules%5B%5C%5C/%5D((?!(chart)).*)%5B%5C%5C/%5D/,%0A    
         chun
@@ -2744,15 +2744,8 @@
 ymce
-%7Ccharts
 /.te
@@ -2768,16 +2768,20 @@
         
+    
 name: 'v
@@ -2788,16 +2788,38 @@
 endors'%0A
+          %7D%0A        %7D%0A
       %7D,

include momentjs that's used in charts from the vendor