facebook / docusaurus

Easy to maintain open source documentation websites.
https://docusaurus.io
MIT License
56.49k stars 8.48k forks source link

Dependency of `@types/react-loadable` causes type conflict issues in 2.0.0-beta.7/8 #5772

Closed favna closed 3 years ago

favna commented 3 years ago

πŸ› Bug Report

Prerequisites

Description

In the PR https://github.com/facebook/docusaurus/pull/5601 a change was made to ensure @types packages are in the dependencies instead of the dev-dependencies. This however introduced a regression issue in @docusaurus/module-type-aliases through @types/react-loadable. Specifically, those types still depend on @types/webpack ^4 which conflicts with Docusaurus using Webpack 5 as of https://github.com/facebook/docusaurus/pull/4089.

I have already added "skipLibCheck": true to my /tsconfig.json but that is completely to no avail. I don't know how Docusaurus reads the tsconfig exactly but it seems to disregard at least that property.

My suggestion for the fix is one of:

Here are some console outputs and yarn lockfile dumps:

yarn why @types/webpack -R
└─ root-website@workspace:.
   └─ @docusaurus/module-type-aliases@npm:2.0.0-beta.8 (via npm:2.0.0-beta.8)
      └─ @types/react-loadable@npm:5.5.6 (via npm:*)
         └─ @types/webpack@npm:4.41.31 (via npm:^4)
"@docusaurus/module-type-aliases@npm:2.0.0-beta.8":
  version: 2.0.0-beta.8
  resolution: "@docusaurus/module-type-aliases@npm:2.0.0-beta.8"
  dependencies:
    "@types/react": "*"
    "@types/react-helmet": "*"
    "@types/react-loadable": "*"
    "@types/react-router-config": "*"
    "@types/react-router-dom": "*"
  checksum: 995ea7c62fab5968abd2b0d61b2ec6f0362e32d5fd27363eb15f90cd8e299777c56e4d82f1b09aebd45b18a6601f9e122ccb1b1d7dea6dc74f0e2f2116167628
  languageName: node
  linkType: hard

"@types/react-loadable@npm:*":
  version: 5.5.6
  resolution: "@types/react-loadable@npm:5.5.6"
  dependencies:
    "@types/react": "*"
    "@types/webpack": ^4
  checksum: 395ff992cf8dbbd425aa79cc298987b464eab875b7057cb4475bfcabd17780d074cf3b7e2511f494fb8e4105a3fe5c9218237f8205f498c38b63671605463415
  languageName: node
  linkType: **hard**

"@types/webpack@npm:^4":
  version: 4.41.31
  resolution: "@types/webpack@npm:4.41.31"
  dependencies:
    "@types/node": "*"
    "@types/tapable": ^1
    "@types/uglify-js": "*"
    "@types/webpack-sources": "*"
    anymatch: ^3.0.0
    source-map: ^0.6.0
  checksum: 8aa4b4ad68bb7a6ee5bd027005014e6242434162ed4c14cd251713ad6041e42bf7629fc56a5edc5a2124b49cc0dce273d6ee3386fae9a9cfe02e1f7e82087ea2
  languageName: node
  linkType: hard

Have you read the Contributing Guidelines on issues?

Yes πŸ˜„!

Steps to reproduce

Use https://new.docusaurus.io to create a CodeSandbox reproducible demo of the bug., N.A. because those samples are using JavaScript and this is TypeScript issue. I have a branch on my repo, however.

  1. Clone the repo with submodules: git clone --recurse-submodules -j8 https://github.com/sapphiredev/website.git && git submodule update --init --recursive
  2. Checkout the branch called feat/update-to-docusaurus-beta-8
  3. Run yarn install to setup the dependency tree (note: due to submodules being in the yarn workspace this takes a bit)
  4. Run yarn start.

Expected behavior

Everything builds fine without type errors. I have no breaking changes to cover between betas 6 and 8.

Actual behavior

When running docusaurus start with 2.0.0-beta.8 I get all of these type errors from node_modules directories:

click me to expand large code block ``` Error: node_modules/@types/webpack/index.d.ts:32:3 - error TS2305: Module '"tapable"' has no exported member 'Tapable'. 32 Tapable, ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1081:23 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1081 resolver: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1082:22 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1082 factory: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1083:28 - error TS2707: Generic type 'AsyncSeriesWaterfallHook' requires between 1 and 2 type arguments. 1083 beforeResolve: AsyncSeriesWaterfallHook; ~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1084:27 - error TS2707: Generic type 'AsyncSeriesWaterfallHook' requires between 1 and 2 type arguments. 1084 afterResolve: AsyncSeriesWaterfallHook; ~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1085:27 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1085 createModule: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1086:21 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1086 module: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1087:27 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1087 createParser: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1089:30 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1089 createGenerator: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1090:24 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1090 generator: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1099:33 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1099 evaluateTypeof: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1100:27 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1100 evaluate: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1101:37 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1101 evaluateIdentifier: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1102:44 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1102 evaluateDefinedIdentifier: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1103:47 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1103 evaluateCallExpressionMember: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1104:28 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1104 statement: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1105:30 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1105 statementIf: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1106:24 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1106 label: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1107:25 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1107 import: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1108:34 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1108 importSpecifier: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1109:25 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1109 export: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1110:31 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1110 exportImport: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1111:36 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1111 exportDeclaration: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1112:35 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1112 exportExpression: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1113:34 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1113 exportSpecifier: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1114:40 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1114 exportImportSpecifier: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1115:33 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1115 varDeclaration: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1116:36 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1116 varDeclarationLet: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1117:38 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1117 varDeclarationConst: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1118:36 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1118 varDeclarationVar: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1119:28 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1119 canRename: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1120:25 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1120 rename: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1121:27 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1121 assigned: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1122:25 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1122 typeof: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1123:29 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1123 importCall: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1124:23 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1124 call: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1125:32 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1125 callAnyMember: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1126:22 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1126 new: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1127:29 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1127 expression: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1128:38 - error TS2314: Generic type 'HookMap' requires 1 type argument(s). 1128 expressionAnyMember: HookMap; ~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1129:48 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1129 expressionConditionalOperator: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1130:44 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1130 expressionLogicalOperator: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1131:26 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1131 program: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1140:28 - error TS2707: Generic type 'AsyncSeriesWaterfallHook' requires between 1 and 2 type arguments. 1140 beforeResolve: AsyncSeriesWaterfallHook; ~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1141:27 - error TS2707: Generic type 'AsyncSeriesWaterfallHook' requires between 1 and 2 type arguments. 1141 afterResolve: AsyncSeriesWaterfallHook; ~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1142:33 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1142 contextModuleFiles: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1143:27 - error TS2707: Generic type 'AsyncSeriesWaterfallHook' requires between 1 and 2 type arguments. 1143 alternatives: AsyncSeriesWaterfallHook; ~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1163:21 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1163 unseal: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1164:19 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1164 seal: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1166:40 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1166 optimizeDependenciesBasic: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1167:35 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1167 optimizeDependencies: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1168:43 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1168 optimizeDependenciesAdvanced: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1171:23 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1171 optimize: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1173:35 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1173 optimizeModulesBasic: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1174:30 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1174 optimizeModules: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1175:38 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1175 optimizeModulesAdvanced: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1190:27 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1190 shouldRecord: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1209:25 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1209 beforeHash: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1210:24 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1210 afterHash: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1216:33 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1216 beforeModuleAssets: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1217:40 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1217 shouldGenerateChunkAssets: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1218:32 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1218 beforeChunkAssets: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1223:31 - error TS2707: Generic type 'AsyncSeriesHook' requires between 1 and 2 type arguments. 1223 additionalAssets: AsyncSeriesHook; ~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1229:33 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1229 needAdditionalSeal: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1230:24 - error TS2707: Generic type 'AsyncSeriesHook' requires between 1 and 2 type arguments. 1230 afterSeal: AsyncSeriesHook; ~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1238:33 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1238 needAdditionalPass: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1239:28 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1239 childCompiler: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1243:43 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1243 optimizeExtractedChunksBasic: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1244:38 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1244 optimizeExtractedChunks: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1245:46 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1245 optimizeExtractedChunksAdvanced: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1258:27 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1258 jsonpScript?: SyncWaterfallHook | undefined; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1259:22 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1259 require: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1260:32 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1260 requireExtensions: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1261:28 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1261 requireEnsure: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1262:24 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1262 localVars: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1263:27 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1263 afterStartup: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1277:22 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1277 content: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1278:21 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1278 module: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1279:21 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1279 render: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1280:22 - error TS2707: Generic type 'SyncWaterfallHook' requires between 1 and 2 type arguments. 1280 package: SyncWaterfallHook; ~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1281:19 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1281 hash: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1375:25 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1375 shouldEmit: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1377:29 - error TS2707: Generic type 'AsyncSeriesHook' requires between 1 and 2 type arguments. 1377 additionalPass: AsyncSeriesHook; ~~~~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1393:25 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1393 watchClose: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1394:26 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1394 environment: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1395:31 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1395 afterEnvironment: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1398:26 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1398 entryOption: SyncBailHook; ~~~~~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1418:25 - error TS2707: Generic type 'SyncHook' requires between 1 and 3 type arguments. 1418 watchClose: SyncHook; ~~~~~~~~ Error: node_modules/@types/webpack/index.d.ts:1485:24 - error TS2707: Generic type 'SyncBailHook' requires between 2 and 3 type arguments. 1485 _pluginCompat: SyncBailHook; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ```

Your environment

Reproducible demo

Use https://new.docusaurus.io to create a CodeSandbox reproducible demo of the bug. N.A., see reason above.

  1. Clone the repo with submodules: git clone --recurse-submodules -j8 https://github.com/sapphiredev/website.git && git submodule update --init --recursive
  2. Checkout the branch called feat/update-to-docusaurus-beta-8
  3. Run yarn install to setup the dependency tree (note: due to submodules being in the yarn workspace this takes a bit)
  4. Run yarn start.
Josh-Cena commented 3 years ago

Mmmm, I do remember seeing these errors somewhere, but now I can't reproduce elsewhere. skipLibCheck won't work because it only gives up on checking transitive declarations. Observations:

I think that's sufficient to conclude that at least this is not a widespread issue. Not to dismiss your issue as irrelevant or unimportant, but I think we either need to look into the setup of docusaurus-plugin-typedoc or find a patching solution on your side, e.g. setting "resolutions": {"@types/webpack": "^5.28.0"} since you are using yarn

  • Remove the entire @types/react-loadable dependency. You guys have your own @docusaurus/react-loadable fork. I'm not sure why @docusaurus/module-type-aliases is even depending on the types? Why not add the necessary types that you do need to your fork so you have no dependency at all anymore on the original work?

Per documentation of this fork:

IMPORTANT: this is a minimalistic fork to solve the componentWillMount warning for the facebook/docusaurus project.

We don't plan to maintain this problem, just get rid of the warning.

Also, we still import the modules as 'react-loadable' through Webpack alias, so we do need type definitions on the @types/react-loadable side.

  • Ensure @types/react-loadable starts using Webpack v5 by contributing that to DefinitelyTyped

I'm actually unsure why @types/react-loadable depends on @types/webpack@^4 when there's also a @types/webpack@5 available, perhaps a DT publishing problem. I'll consult what's the best solution to this

favna commented 3 years ago

I actually did try adding @types/webpack to my resolutions as you suggested so when you I saw your edit I figured maybe I misremembered and it did work. I went ahead and tried again, and now I see again why it didn't work.

For whatever reason doing so causes a JavaScript Heap Out Of Memory issue. I ran docusaurus start also with --max-old-space-size=4096 but to no avail. I then tried --inspect ----max-old-space-size=4096 which suddenly worked, however as I was in the debugger at the same time I did get a breakpoint where Node detected a possible memory leak, which was in TypeScript code. This was while as far as Docusaurus was concerned it was still running typedoc things.

Then I tried bumping the max old space to 5120 and that actually seems to have it work consistently.

What in tarnation sake could be causing it to need >= 4GB && < 5 GB RAM just to run is truly beyond me. It sure as heck can't be my hardware specs (64 GB RAM @ 3200 MHz, Ryzen 3900X).

What's also notable is that this extreme RAM requirement is only for typedoc, because once the webpack server is running the Node application is consuming about 920 MB of RAM on my system which is a pretty reasonable amount considering the V8 engine is likely to realize there's so much available anyway that it might as well. (My browser commonly consumes 1-1.5 GB RAM as well, even with just a few tabs open)

For now what I think I'll do is update to beta 8, add the resolutions field and make this change in our scripts but I'd really like to help in any way I can with getting to the bottom of why the typedoc plugin consumes so much RAM when tasked with the amount of projects that we task it with.

-        "docusaurus": "docusaurus",
-        "start": "docusaurus start",
-        "build": "docusaurus build",
+        "docusaurus": "cross-env NODE_OPTIONS=\"--max-old-space-size=5120\"",
+        "start": "cross-env NODE_OPTIONS=\"--max-old-space-size=5120\" docusaurus start",
+        "build": "cross-env NODE_OPTIONS=\"--max-old-space-size=5120\" docusaurus build",
Josh-Cena commented 3 years ago

That I have no idea. I suspect it's that typedoc goes into the entire webpack to map out the type information which brings in a lot of overhead, compared to the much smaller @types/webpack.

slorber commented 3 years ago

react-loadable is not maintained anymore and our fork just made some fixes for webpack 5 afaik.

We could basically just replace its typedefs with any and get rid once for all of Webpack 4 typings, that wouldn't be so harmful.

I'd like to replace it someday but considering React.lazy SSR + Suspense support is coming in React 18, I'd rather not migrate to loadable-components now.

Josh-Cena commented 3 years ago

@slorber Do you by any chance know why react-loadable still works in WP5 without any changes? Is our usage not touching any WP4 API?

slorber commented 3 years ago

It works because there were no Webpack breaking changes affecting it, by luck.

Apparently my fork only removed the annoying deprecation warning: https://github.com/slorber/react-loadable/commits/master

I'm trying to get a docusaurus-core org to move all our forks there and make things more explicit

Josh-Cena commented 3 years ago

Yeah, I'm asking because of this remark

slorber commented 3 years ago

please test the canary release

favna commented 3 years ago

@slorber I just tried out Canary (0.0.0-4137) and can confirm that this issue is fixed. I no longer need the cross-env NODE_OPTIONS=\"--max-old-space-size=5120\", nor the resolution for @types/webpack (which doesn't get installed at all anymore now, as it should be). Thanks for the awesome work!

slorber commented 3 years ago

Great, thanks 😜

Le ven. 29 oct. 2021 Γ  22:06, Jeroen Claassens @.***> a Γ©crit :

@slorber https://github.com/slorber I just tried out Canary (0.0.0-4137) and can confirm that this issue is fixed. I no longer need the cross-env NODE_OPTIONS=\"--max-old-space-size=5120\" I mentioned in my previous comment. Thanks for the awesome work!

β€” You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/facebook/docusaurus/issues/5772#issuecomment-955017386, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAFW6PWONOYCE4WQ3KGY5LTUJMEDXANCNFSM5GRPWZ2A .