make custom types for CssModule and CssDependency

Author: barak007

package-lock.json

@@ -42,7 +42,8 @@
   },
   "files": [
     "dist",
-    "types"
+    "types",
+    "public.d.ts"
   ],
   "peerDependencies": {
     "webpack": "^5.0.0"
@@ -53,29 +54,29 @@
   "devDependencies": {
     "@babel/cli": "^7.16.7",
     "@babel/core": "^7.16.7",
-    "@babel/eslint-parser": "^7.16.0",
+    "@babel/eslint-parser": "^7.16.5",
     "@babel/preset-env": "^7.16.7",
-    "@commitlint/cli": "^15.0.0",
-    "@commitlint/config-conventional": "^15.0.0",
+    "@commitlint/cli": "^16.0.2",
+    "@commitlint/config-conventional": "^16.0.0",
     "@webpack-contrib/eslint-config-webpack": "^3.0.0",
     "babel-jest": "^27.0.6",
     "bootstrap": "^4.6.0",
     "cross-env": "^7.0.3",
     "css-loader": "^6.2.0",
     "del": "^6.0.0",
     "del-cli": "^4.0.0",
-    "es-check": "^6.0.0",
-    "eslint": "^8.6.0",
-    "eslint-config-prettier": "^8.1.0",
+    "es-check": "^6.1.1",
+    "eslint": "^8.7.0",
+    "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-import": "^2.25.4",
     "file-loader": "^6.2.0",
     "husky": "^7.0.0",
     "jest": "^27.0.6",
     "jsdom": "^19.0.0",
-    "lint-staged": "^12.1.5",
+    "lint-staged": "^12.1.7",
     "memfs": "^3.4.1",
     "npm-run-all": "^4.1.5",
-    "prettier": "^2.3.2",
+    "prettier": "^2.5.1",
     "sass": "^1.45.2",
     "sass-loader": "^12.1.0",
     "standard-version": "^9.3.0",

package.json

@@ -0,0 +1,57 @@
+type Module = import("webpack").Module;
+type Dependency = import("webpack").Dependency;
+type Source = import("webpack").sources.Source;
+type AssetInfo = import("webpack").AssetInfo;
+
+export interface CssModule {
+  new ({
+    context,
+    identifier,
+    identifierIndex,
+    content,
+    layer,
+    supports,
+    media,
+    sourceMap,
+    assets,
+    assetsInfo,
+  }: {
+    context: string;
+    identifier: string;
+    identifierIndex: number;
+    content: Buffer;
+    layer: string | null;
+    supports?: string;
+    media: string;
+    sourceMap?: Buffer;
+    assets: { [key: string]: Source };
+    assetsInfo: Map<string, AssetInfo>;
+  }): Module;
+}
+
+interface CssDependencyPublicOptions {
+  identifier: string;
+  content: Buffer;
+  layer?: string;
+  supports?: string;
+  media: string;
+  sourceMap?: Buffer;
+}
+
+export interface CssDependency {
+  new (
+    {
+      identifier,
+      content,
+      layer,
+      supports,
+      media,
+      sourceMap,
+    }: CssDependencyPublicOptions,
+    context: string | null,
+    identifierIndex: number
+  ): Dependency & {
+    assetsInfo?: Map<string, AssetInfo>;
+    assets?: { [key: string]: Source };
+  };
+}

public.d.ts

@@ -88,7 +88,7 @@ class MiniCssExtractPlugin {
   /**
    * @public
    * @param {Compiler["webpack"]} webpack
-   * @returns {typeof CssModule}
+   * @returns {import("../public").CssModule}
    */
   static getCssModule(webpack) {
     /**
@@ -348,7 +348,7 @@ class MiniCssExtractPlugin {
   /**
    * @public
    * @param {Compiler["webpack"]} webpack
-   * @returns {typeof CssDependency}
+   * @returns {import("../public").CssDependency}
    */
   static getCssDependency(webpack) {
     /**

src/index.js

@@ -126,12 +126,11 @@ function pitch(request) {
           identifierCountMap.get(
             /** @type {Dependency} */ (dependency).identifier
           ) || 0;
-        // @ts-ignore
+
         const CssDependency = MiniCssExtractPlugin.getCssDependency(webpack);
 
         /** @type {NormalModule} */
         (this._module).addDependency(
-          // @ts-ignore
           (lastDep = new CssDependency(
             /** @type {Dependency} */
             (dependency),

src/loader.js

@@ -9,5 +9,5 @@
     "resolveJsonModule": true,
     "allowSyntheticDefaultImports": true
   },
-  "include": ["./src/**/*"]
+  "include": ["./src/**/*", "public.d.ts"]
 }

tsconfig.json

@@ -3,15 +3,19 @@ declare class MiniCssExtractPlugin {
   /**
    * @public
    * @param {Compiler["webpack"]} webpack
-   * @returns {typeof CssModule}
+   * @returns {import("../public").CssModule}
    */
-  private static getCssModule;
+  public static getCssModule(
+    webpack: Compiler["webpack"]
+  ): import("../public").CssModule;
   /**
    * @public
    * @param {Compiler["webpack"]} webpack
-   * @returns {typeof CssDependency}
+   * @returns {import("../public").CssDependency}
    */
-  private static getCssDependency;
+  public static getCssDependency(
+    webpack: Compiler["webpack"]
+  ): import("../public").CssDependency;
   /**
    * @param {PluginOptions} [options]
    */