fix react-refresh-utils types

vercel · Sep 16, 2021 · ea0b3aa · ea0b3aa
1 parent f95ca32
commit ea0b3aa
Show file tree

Hide file tree

Showing 6 changed files with 15 additions and 16 deletions.
diff --git a/package.json b/package.json
@@ -68,7 +68,7 @@
     "alex": "9.1.0",
     "amphtml-validator": "1.0.33",
     "async-sema": "3.0.1",
-    "browserslist": "^4.14.7",
+    "browserslist": "4.16.6",
     "cheerio": "0.22.0",
     "clone": "2.1.2",
     "cookie": "0.4.1",

diff --git a/packages/next/types/webpack.d.ts b/packages/next/types/webpack.d.ts
@@ -44,7 +44,11 @@ declare module 'webpack' {
   import webpack4 from 'webpack4'
   import webpack5 from 'webpack5'
   export type Compiler = webpack4.Compiler | webpack5.Compiler
+  export type Compilation =
+    | webpack4.compilation.Compilation
+    | webpack5.Compilation
   export type Stats = webpack4.Stats | webpack5.Stats
+  export { Template, RuntimeModule, RuntimeGlobals } from 'webpack5'
 }
 
 declare module 'webpack4' {

diff --git a/packages/react-refresh-utils/ReactRefreshWebpackPlugin.ts b/packages/react-refresh-utils/ReactRefreshWebpackPlugin.ts
@@ -1,18 +1,14 @@
-// types only import
 import {
   Compiler as WebpackCompiler,
   Template as WebpackTemplate,
-  // @ts-ignore exists in webpack 5
   RuntimeModule as WebpackRuntimeModule,
-  // @ts-ignore exists in webpack 5
   RuntimeGlobals as WebpackRuntimeGlobals,
-  // @ts-ignore exists in webpack 5
-  compilation as WebpackCompilation,
-} from 'webpack4'
+  Compilation as WebpackCompilation,
+} from 'webpack'
 
 // Shared between webpack 4 and 5:
 function injectRefreshFunctions(
-  compilation: WebpackCompilation.Compilation,
+  compilation: WebpackCompilation,
   Template: typeof WebpackTemplate
 ) {
   const hookVars: any = (compilation.mainTemplate.hooks as any).localVars
@@ -97,7 +93,6 @@ function webpack5(this: ReactFreshWebpackPlugin, compiler: WebpackCompiler) {
     }
 
     generate() {
-      // @ts-ignore This exists in webpack 5
       const { runtimeTemplate } = this.compilation
       return Template.asString([
         `if (${RuntimeGlobals.interceptModuleExecution}) {`,

diff --git a/packages/react-refresh-utils/loader.ts b/packages/react-refresh-utils/loader.ts
@@ -1,7 +1,4 @@
-import {
-  // @ts-ignore exists in webpack 5
-  loader,
-} from 'webpack4'
+import type { LoaderDefinition } from 'webpack'
 import RefreshModuleRuntime from './internal/ReactRefreshModule.runtime'
 
 let refreshModuleRuntime = RefreshModuleRuntime.toString()
@@ -10,7 +7,7 @@ refreshModuleRuntime = refreshModuleRuntime.slice(
   refreshModuleRuntime.lastIndexOf('}')
 )
 
-const ReactRefreshLoader: loader.Loader = function ReactRefreshLoader(
+const ReactRefreshLoader: LoaderDefinition = function ReactRefreshLoader(
   source,
   inputSourceMap
 ) {

diff --git a/packages/react-refresh-utils/tsconfig.json b/packages/react-refresh-utils/tsconfig.json
@@ -6,7 +6,10 @@
     "target": "es2015",
     "lib": ["dom"],
     "downlevelIteration": true,
-    "preserveWatchOutput": true
+    "preserveWatchOutput": true,
+    "paths": {
+      "webpack": ["../../node_modules/webpack5"]
+    }
   },
   "include": ["**/*.ts"],
   "exclude": ["node_modules"]

diff --git a/yarn.lock b/yarn.lock
@@ -6419,7 +6419,7 @@ browserify-zlib@0.2.0, browserify-zlib@^0.2.0:
   dependencies:
     pako "~1.0.5"
 
-browserslist@4.16.6, browserslist@^4.0.0, browserslist@^4.14.5, browserslist@^4.14.7, browserslist@^4.15.0, browserslist@^4.16.6, browserslist@^4.16.7, browserslist@^4.3.6, browserslist@^4.6.4, browserslist@^4.8.3:
+browserslist@4.16.6, browserslist@^4.0.0, browserslist@^4.14.5, browserslist@^4.15.0, browserslist@^4.16.6, browserslist@^4.16.7, browserslist@^4.3.6, browserslist@^4.6.4, browserslist@^4.8.3:
   version "4.16.6"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.16.6.tgz#d7901277a5a88e554ed305b183ec9b0c08f66fa2"
   integrity sha512-Wspk/PqO+4W9qp5iUTJsa1B/QrYn1keNCcEP5OvP7WBwT4KaDly0uONYmC6Xa3Z5IqnUgS0KcgLYu1l74x0ZXQ==