webpack.config.js

// Copyright 2022 The Fuchsia Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

'use strict';

const path = require('path');
// eslint-disable-next-line @typescript-eslint/naming-convention
const MiniCssExtractPlugin = require('mini-css-extract-plugin');


const extensionConfig = {
  // vscode extensions run in a Node.js-context 📖 -> https://webpack.js.org/configuration/node/
  target: 'node',

  // the entry point of this extension, 📖 -> https://webpack.js.org/configuration/entry-context/
  entry: {
    extension: './src/extension.ts',
  },

  // the bundle is stored in the 'dist' folder (check package.json),
  // 📖 -> https://webpack.js.org/configuration/output/
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'extension.js',
    libraryTarget: 'commonjs2',
    devtoolModuleFilenameTemplate: '../[resource-path]',
  },
  devtool: 'source-map',
  externals: {
    // the vscode-module is created on-the-fly and must be excluded. Add other modules that cannot
    // be webpack'ed, 📖 -> https://webpack.js.org/configuration/externals/
    vscode: 'commonjs vscode'
  },
  // support reading TypeScript and JavaScript files, 📖 -> https://github.com/TypeStrong/ts-loader
  resolve: {
    extensions: ['.ts', '.js']
  },
  module: {
    rules: [{
      include: path.join(__dirname, 'src'),
      exclude: /node_modules/,
      test: /\.ts$/,
      use: [{
        loader: 'ts-loader',
        options: {
          configFile: path.join(__dirname, 'tsconfig.json'),
        }
      }]
    }]
  },
};

const webviewsConfig = {
  name: 'webviews',
  entry: {
    // If new webviews are created, they must be added here.
    'webview-logging': './webviews/logging/index.ts',
  },
  target: 'web',
  devtool: 'source-map',
  output: {
    filename: '[name].js',
    path: path.join(__dirname, 'dist'),
  },
  resolve: {
    extensions: ['.ts', '.js'],
  },
  module: {
    rules: [
      {
        exclude: /node_modules/,
        include: path.join(__dirname, 'webviews'),
        test: /\.ts$/,
        use: {
          loader: 'ts-loader',
          options: {
            configFile: path.join(__dirname, 'tsconfig.webviews.json'),
          }
        },
      },
      {
        test: /\.css/,
        use: [MiniCssExtractPlugin.loader, 'css-loader'],
      }
    ],
  },
  plugins: [new MiniCssExtractPlugin()],
};

module.exports = [
  extensionConfig,
  webviewsConfig,
];