I've just spent a few hours trying to get webpack to recognize a .d.ts file I made about a small module I'd like to use which doesn't have a @types package (png-to-jpeg, an imagemin plugin).
The import is as basic as it gets :
import pngToJpeg from "png-to-jpeg";
Here is the src/typings/png-to-jpeg/index.d.ts
file:
declare module "png-to-jpeg" {
export default import("imagemin").Plugin;
}
My IDE (VSCode) seems happy with it, it removed the error as soon as I added this file, but webpack refuses to recognize it and I had to fallback to a require to get it to work. Here's my webpack config:
/* eslint-disable @typescript-eslint/no-var-requires */
/* eslint-disable no-undef */
const path = require("path");
const dotenv = require("dotenv");
const TsconfigPathsPlugin = require("tsconfig-paths-webpack-plugin");
const nodeExternals = require("webpack-node-externals");
const NodemonPlugin = require("nodemon-webpack-plugin");
dotenv.config();
module.exports = env => {
const {
NODE_ENV = typeof env.NODE_ENV === "string" ? process.env.NODE_ENV : "production"
} = env;
return {
entry: "./index.ts",
mode: NODE_ENV,
target: "node",
output: {
path: path.resolve(__dirname, "build"),
filename: "index.js"
},
resolve: {
extensions: [".ts", ".js", ".d.ts"],
plugins: [new TsconfigPathsPlugin({ })],
},
watch: NODE_ENV === "development",
module: {
rules: [
{
test: /\.ts$/,
use: [
"ts-loader",
]
}
]
},
externals: [nodeExternals()],
plugins: [
new NodemonPlugin(),
],
};
};
Which is started using webpack --env NODE_ENV=development
If you have any idea, that'd be great, thanks