react import missing in types.ts

[shahshreya2108]

Getting below error while running npm run build in my project

(!) Plugin postcss: start value has mixed support, consider using flex-start instead src/Components/LineLinkDisplay/LineLinkItem/LineLinkItem.module.scss created dist/cjs, dist/es in 7.9s node_modules/react-quick-pinch-zoom/esm/PinchZoom/types.d.ts:28:21 - error TS2503: Cannot find namespace 'React'. 28 containerProps: React.HTMLAttributes<HTMLDivElement>; ~~~~~ Found 1 error in node_modules/react-quick-pinch-zoom/esm/PinchZoom/types.d.ts:28

[retyui]

can you show stdout

npm list react @types/react

[shahshreya2108]

storefront-h5-sdk@3.0.10 /Users/shreyakotadia/Documents/Shreya/Workspace/paytm/storefront_h5_sdk
├─┬ react-dom@18.2.0
│ └── react@18.2.0 deduped
├─┬ react-quick-pinch-zoom@5.0.0
│ └── react@18.2.0 deduped
├─┬ react-visibility-sensor@5.1.1
│ └── react@18.2.0 deduped
└── react@18.2.0

[retyui]

the next command should help:

npm install --save @types/react

[shahshreya2108]

Now getting below error:

node_modules/react-quick-pinch-zoom/esm/PinchZoom/component.d.ts:1:8 - error TS1259: Module '"/Users/shreyakotadia/Documents/Shreya/Workspace/test/node_modules/@types/react/index"' can only be default-imported using the 'esModuleInterop' flag

import React from 'react';
         ~~~~~

  node_modules/@types/react/index.d.ts:32:1
    32 export = React;
       ~~~~~~~~~~~~~~~
    This module is declared with 'export =', and can only be used with a default import when using the 'esModuleInterop' flag.

node_modules/react-visibility-sensor/index.d.ts:34:38 - error TS2694: Namespace 'React' has no exported member 'StatelessComponent'.

34   const ReactVisibilitySensor: React.StatelessComponent<Props>;
                                        ~~~~~~~~~~~~~~~~~~


Found 2 errors in 2 files.

Errors  Files
     1  node_modules/react-quick-pinch-zoom/esm/PinchZoom/component.d.ts:1
     1  node_modules/react-visibility-sensor/index.d.ts:34

[retyui]

• fixed in 5.1.0
• npm diff 5.0.0...5.1.0

[shahshreya2108]

This helped, thanks a lot for the quick release!

[retyui]

thanks for letting me know)

[brightertools]

I seem to have this same error:
Could not resolve "prop-types"

Am following this example: https://blog.logrocket.com/adding-zoom-pan-pinch-react-web-apps/
but using vite

+-- @types/react-dom@18.2.18
| -- @types/react@18.2.47 deduped +-- @types/react@18.2.47 +-- react-dom@18.2.0 | -- react@18.2.0 deduped
+-- react-quick-pinch-zoom@5.1.0
| -- react@18.2.0 deduped -- react@18.2.0

[retyui]

I seem to have this same error: Could not resolve "prop-types"

Am following this example: https://blog.logrocket.com/adding-zoom-pan-pinch-react-web-apps/ but using vite

+-- @types/react-dom@18.2.18 | -- @types/react@18.2.47 deduped +-- @types/react@18.2.47 +-- react-dom@18.2.0 | -- react@18.2.0 deduped +-- react-quick-pinch-zoom@5.1.0 | -- react@18.2.0 deduped -- react@18.2.0

see: #76 (comment)