webpack.config.js

   1 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
   2 const nodeExternals = require('webpack-node-externals');
   3 const path = require('path');
   4
   5 module.exports = function (env, _) {
   6   const base = {
   7     // mode: "production",
   8     mode: 'development',
   9     entry: './src/server/index.tsx', // Point to main file
  10     output: {
  11       path: path.resolve(process.cwd(), 'dist'),
  12       filename: 'js/server.js',
  13       publicPath: '/',
  14     },
  15     resolve: {
  16       extensions: ['.js', '.jsx', '.ts', '.tsx'],
  17     },
  18     performance: {
  19       hints: false,
  20     },
  21     module: {
  22       rules: [
  23         {
  24           test: /\.(scss|css)$/i,
  25           use: [
  26             MiniCssExtractPlugin.loader,
  27             'css-loader',
  28             {
  29               loader: 'postcss-loader', // Run post css actions
  30               options: {
  31                 plugins: function () {
  32                   // post css plugins, can be exported to postcss.config.js
  33                   return [require('precss'), require('autoprefixer')];
  34                 },
  35               },
  36             },
  37             'sass-loader',
  38           ],
  39         },
  40         {
  41           test: /\.(js|jsx|tsx|ts)$/, // All ts and tsx files will be process by
  42           loaders: 'babel-loader', // first babel-loader, then ts-loader
  43           exclude: /node_modules/, // ignore node_modules
  44         },
  45       ],
  46     },
  47     devServer: {
  48       host: '0.0.0.0',
  49       contentBase: 'src/',
  50       historyApiFallback: true,
  51     },
  52     plugins: [
  53       new MiniCssExtractPlugin({
  54         filename: 'styles/styles.css',
  55       }),
  56     ],
  57   };
  58
  59   // server-specific configuration
  60   if (env.platform === 'server') {
  61     base.target = 'node';
  62     base.externals = [nodeExternals()];
  63   }
  64   // client-specific configurations
  65   if (env.platform === 'client') {
  66     base.entry = './src/client/index.tsx';
  67     base.output.filename = 'js/client.js';
  68   }
  69   return base;
  70 };