commas

frontend/webpack/webpack.dev.js

@@ -0,0 +1,92 @@
+/* eslint-disable import/no-extraneous-dependencies */
+
+const { HotModuleReplacementPlugin } = require('webpack');
+const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
+const HardSourceWebpackPlugin = require('hard-source-webpack-plugin');
+const commonPaths = require('./paths');
+
+module.exports = {
+  devtool: 'cheap-eval-source-map',
+  output: {
+    filename: '[name].js',
+    path: commonPaths.outputPath,
+    chunkFilename: '[name].js',
+  },
+  module: {
+    rules: [
+      {
+        test: /\.(js|jsx)$/, // allows both .jsx and .js
+        exclude: /node_modules/,
+        include: commonPaths.source,
+        loader: 'babel-loader',
+        options: {
+          cacheDirectory: true,
+          plugins: ['react-hot-loader/babel'],
+        },
+      },
+      {
+        test: /\.(sa|sc|c)ss$/,
+        use: [{
+          loader: 'style-loader',
+        },
+        {
+          loader: 'css-loader',
+          options: {
+            modules: false,
+          },
+        },
+        {
+          loader: 'sass-loader',
+        },
+        ],
+      },
+    ],
+  },
+  devServer: {
+    contentBase: commonPaths.outputPath,
+    compress: true,
+    hot: true,
+    port: 3001,
+  },
+  plugins: [
+    new HotModuleReplacementPlugin(),
+    new HardSourceWebpackPlugin({
+      // Either an absolute path or relative to webpack's options.context.
+      cacheDirectory: commonPaths.cachePath,
+      // Either a string of object hash function given a webpack config.
+      // node-object-hash on npm can be used to build this.
+      configHash: (webpackConfig) => require('node-object-hash')({ // eslint-disable-line
+        sort: false,
+      }).hash(webpackConfig),
+      // Either false, a string, an object, or a project hashing function.
+      environmentHash: {
+        root: process.cwd(),
+        directories: [],
+        files: [
+          // Cache will get an unique hash based on those files
+          // if either of them changes, new cache must be generated
+          'package-lock.json',
+          '.babelrc.js',
+        ],
+      },
+      info: {
+        mode: 'none',
+        level: 'debug',
+      },
+      // Clean up large, old caches automatically.
+      cachePrune: {
+        // Caches younger than `maxAge` are not considered for deletion.
+        // They must be at least this old in milliseconds.
+        maxAge: 3 * 60 * 60 * 1000, // 3 hours
+        // All caches together must be larger than `sizeThreshold` before any
+        // caches will be deleted.
+        // Together they must be at least this big in bytes.
+        sizeThreshold: 50 * 1024 * 1024, // 50 MB
+      },
+    }),
+    new BundleAnalyzerPlugin({
+      analyzerPort: 8888,
+      openAnalyzer: false,
+    }),
+  ],
+};