tsdx create locks up installing react-with-storybook template

sandtreader commented 2 years ago

Current Behavior

tsdx create locks up (for as long as I was prepared to wait, 30 mins or more) when installing npm modules if you choose 'react-with-storybook' template. It works fine with 'react'.

$ tsdx create myproject
<ascii art>

✔ Choose a template · react-with-storybook
✔ Created myproject
⠙ Installing npm modules:
    @babel/core
    @size-limit/preset-small-lib
    @storybook/addon-essentials
    @storybook/addon-info
    @storybook/addon-links
    @storybook/addons
    @storybook/react
    @types/react
    @types/react-dom
    babel-loader
    husky
    react
    react-dom
    react-is
    size-limit
    tsdx
    tslib
    typescript
<hangs forever>

npm logs show it is caught in a loop trying to resolve a conflict between react ^17.0.2 from @storybook/addon-actions and react being 18.2.0:

149994 warn ERESOLVE overriding peer dependency {
149994 warn ERESOLVE   code: 'ERESOLVE',
149994 warn ERESOLVE   edge: {
149994 warn ERESOLVE     type: 'peer',
149994 warn ERESOLVE     name: 'react',
149994 warn ERESOLVE     spec: '^16.8.4 || ^17.0.0',
149994 warn ERESOLVE     error: 'INVALID',
149994 warn ERESOLVE     from: {
149994 warn ERESOLVE       name: 'react-inspector',
149994 warn ERESOLVE       version: '5.1.1',
149994 warn ERESOLVE       location: 'node_modules/@storybook/addon-actions/node_modules/react-inspector',
149994 warn ERESOLVE       isWorkspace: false,
149994 warn ERESOLVE       dependents: [Array]
149994 warn ERESOLVE     }
149994 warn ERESOLVE   },
149994 warn ERESOLVE   dep: {
149994 warn ERESOLVE     name: 'react',
149994 warn ERESOLVE     version: '17.0.2',
149994 warn ERESOLVE     whileInstalling: {
149994 warn ERESOLVE       name: '@storybook/addon-actions',
149994 warn ERESOLVE       version: '6.5.13',
149994 warn ERESOLVE       path: '/local/prc/rafiki/node_modules/@storybook/addon-actions'
149994 warn ERESOLVE     },
149994 warn ERESOLVE     location: 'node_modules/react',
149994 warn ERESOLVE     isWorkspace: false,
149994 warn ERESOLVE     dependents: [ [Object] ]
149994 warn ERESOLVE   },
149994 warn ERESOLVE   current: {
149994 warn ERESOLVE     name: 'react',
149994 warn ERESOLVE     version: '18.2.0',
149994 warn ERESOLVE     location: 'node_modules/react',
149994 warn ERESOLVE     isWorkspace: false,
149994 warn ERESOLVE     dependents: [ [Object] ]
149994 warn ERESOLVE   },
149994 warn ERESOLVE   peerConflict: {
149994 warn ERESOLVE     name: 'react',
149994 warn ERESOLVE     version: '18.2.0',
149994 warn ERESOLVE     location: 'node_modules/react',
149994 warn ERESOLVE     isWorkspace: false,
149994 warn ERESOLVE     dependents: [ [Object] ]
149994 warn ERESOLVE   },
149994 warn ERESOLVE   strictPeerDeps: false,
149994 warn ERESOLVE   force: false,
149994 warn ERESOLVE   isMine: false
149994 warn ERESOLVE }

Expected behavior

The 'npm install' phase should complete.

Additional context

Node 19.1.0, npm 9.1.1 (also failed the same on 14.x / 8.x)

Your environment

  System:
    OS: Linux 5.10 Debian GNU/Linux 11 (bullseye) 11 (bullseye)
    CPU: (24) x64 AMD Ryzen 9 3900X 12-Core Processor
    Memory: 15.18 GB / 31.34 GB
    Container: Yes
    Shell: 5.1.4 - /bin/bash
  Binaries:
    Node: 19.1.0 - ~/.nvm/versions/node/v19.1.0/bin/node
    npm: 9.1.1 - ~/.nvm/versions/node/v19.1.0/bin/npm
  Browsers:
    Chrome: 107.0.5304.110
    Chromium: 107.0.5304.87
    Firefox: 102.4.0esr
  npmPackages:
    tsdx: ^0.14.1 => 0.14.1 
    typescript: ^3.9.10 => 3.9.10

sandtreader commented 2 years ago

Followup which also suggests sticking to React ^17 - the blah.test produces warnings:

Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more: https://reactjs.org/link/switch-to-createroot

(this is using the 'react' template)

sandtreader commented 2 years ago

Just found this PR which I suspect might fix it:

https://github.com/jaredpalmer/tsdx/pull/1142