The directory structure is set up as follows:
└── src
├── tsconfig.json
├── core
│ ├── [...].ts
└── ui
├── [...].tsx
└── tsconfig.json
Within the frontend, I am importing a limited number of modules from the core. These modules, along with any related dependencies, comply with both tsconfig files.
Both tsc and eslint run without errors, and webpack successfully generates the desired output file. All seems well at this point.
However, during the webpack build process, numerous type errors are thrown for backend modules unrelated to the core.
How can these errors be suppressed? I attempted excluding src/core from babel-loader while also including the necessary modules, but the same errors persisted.
/// webpack.config.js
/* eslint-disable @typescript-eslint/no-var-requires */
const path = require('path');
const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
mode: 'development',
entry: './src/ui',
output: {
path: path.resolve(__dirname, './ui-dist'),
},
// Enable sourcemaps for debugging webpack's output.
devtool: 'source-map',
resolve: {
// Add '.ts' and '.tsx' as resolvable extensions.
extensions: ['.ts', '.tsx', '.js', '.jsx'],
},
module: {
rules: [
{
test: /\.(j|t)sx?$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
cacheDirectory: true,
babelrc: false,
presets: [
[
'@babel/preset-env',
{ targets: { browsers: 'last 2 versions' } },
],
'@babel/preset-typescript',
'@babel/preset-react',
],
plugins: [
['@babel/plugin-proposal-decorators', { legacy: true }],
['@babel/plugin-transform-runtime', { legacy: true }],
['@babel/plugin-proposal-class-properties', { loose: true }],
'react-hot-loader/babel',
],
},
},
},
{
enforce: 'pre',
test: /\.js$/,
loader: 'source-map-loader',
},
],
},
plugins: [
new ForkTsCheckerWebpackPlugin({
tsconfig: path.resolve(__dirname, './src/ui/tsconfig.json'),
eslint: true,
}),
new HtmlWebpackPlugin({
title: 'development',
template: './src/ui/template.html',
}),
],
devServer: {
contentBase: path.resolve(__dirname, './ui-dist'),
},
};
EDIT: It seems that the error-throwing modules are referenced using
import type { x } from '../core/index.ts'babel-loader to skip scanning type imports.