Signal-Desktop/webpack.config.ts

// Copyright 2019-2020 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only

import { resolve } from 'path';
// eslint-disable-next-line import/no-extraneous-dependencies
import { Configuration, EnvironmentPlugin, ProvidePlugin } from 'webpack';
import HtmlWebpackPlugin = require('html-webpack-plugin');
import TerserPlugin = require('terser-webpack-plugin');

const context = __dirname;
const { NODE_ENV: mode = 'development' } = process.env;
const isDev = mode === 'development';

const csp = `
  default-src 'none';
  child-src 'self';
  connect-src 'self'${isDev ? ' http: ws:' : ''};
  font-src 'self';
  form-action 'self';
  frame-src 'none';
  img-src 'self' blob: data:;
  media-src 'self' blob:;
  object-src 'none';
  script-src 'self'${isDev ? " 'unsafe-eval'" : ''};
  style-src 'self' 'unsafe-inline';
`;

const stickerCreatorConfig: Configuration = {
  context,
  mode: mode as Configuration['mode'],
  devtool: 'source-map',
  entry: [
    'react-hot-loader/patch',
    'sanitize.css',
    'typeface-inter',
    './sticker-creator/index.tsx',
  ],
  output: {
    path: resolve(context, 'sticker-creator/dist'),
    filename: 'bundle.js',
    publicPath: mode === 'production' ? './' : '/sticker-creator/dist/',
  },
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: [{ loader: 'babel-loader' }],
      },
      {
        test: /\.css$/,
        use: [{ loader: 'style-loader' }, { loader: 'css-loader' }],
      },
      {
        test: /\.scss$/,
        use: [
          { loader: 'style-loader' },
          { loader: 'css-loader?modules=true&localsConvention=camelCaseOnly' },
          { loader: 'sass-loader' },
        ],
      },
      {
        test: /\.woff2?$/,
        use: [{ loader: 'file-loader' }],
      },
    ],
  },
  resolve: {
    extensions: ['.tsx', '.ts', '.jsx', '.js'],
    alias: {},
  },
  plugins: [
    new ProvidePlugin({ Buffer: ['buffer', 'Buffer'] }),
    new EnvironmentPlugin(['NODE_ENV']),
    new HtmlWebpackPlugin({
      title: 'Signal Sticker Creator',
      template: resolve(context, 'sticker-creator/index.html'),
      meta: {
        'Content-Security-Policy': {
          'http-equiv': 'Content-Security-Policy',
          content: csp,
        },
      },
    }),
  ],
  devServer: {
    port: 6380,
    historyApiFallback: {
      rewrites: [{ from: /./, to: '/sticker-creator/dist/index.html' }],
    },
  },
};

const EXTERNAL_MODULE = new Set([
  'backbone',
  'better-sqlite3',
  'ffi-napi',
  'fs-xattr',
  'fsevents',
  'got',
  'jquery',
  'libsignal-client',
  'node-fetch',
  'node-sass',
  'pino',
  'proxy-agent',
  'ref-array-napi',
  'ref-napi',
  'ringrtc',
  'sharp',
  'websocket',
  'zkgroup',
]);

const preloadConfig: Configuration = {
  context,
  mode: mode as Configuration['mode'],
  devtool: mode === 'development' ? 'inline-source-map' : false,
  entry: ['./preload.js'],
  // Stack-traces have to be readable so don't mangle function names.
  optimization: {
    minimizer: [
      new TerserPlugin({
        terserOptions: {
          mangle: {
            keep_fnames: true,
          },
        },
      }),
    ],
  },
  target: 'electron-preload',
  output: {
    path: resolve(context),
    filename: 'preload.bundle.js',
    publicPath: './',
  },
  resolve: {
    extensions: ['.js'],
    alias: {},
  },
  externals: [
    ({ request = '' }, callback) => {
      if (EXTERNAL_MODULE.has(request)) {
        return callback(undefined, `commonjs2 ${request}`);
      }

      callback();
    },
  ],
};

export default [stickerCreatorConfig, preloadConfig];