react-native-qrcode-styled icon indicating copy to clipboard operation
react-native-qrcode-styled copied to clipboard

Typings are broken in the most recent version

Open ericpoulinnz opened this issue 11 months ago • 17 comments

Since 0.3.3 my typings for this library are broken. The library works as expected, but Typescript is complaining.

Here is my import: import QRCodeStyled, { SVGQRCodeStyledProps } from "react-native-qrcode-styled";

And I get this error: Could not find a declaration file for module . /****/node_modules/react-native-qrcode-styled/lib/commonjs/index.js implicitly has an type.

ericpoulinnz avatar Jan 19 '25 23:01 ericpoulinnz

Agree.. I had first thought my NX repo was messed up but it seems like its not working i am 0.33 and have

"react-native-qrcode-styled": "^0.3.3",

and

"@types/qrcode": "^1.5.5",

PvanHengel avatar Jan 28 '25 11:01 PvanHengel

i have the same problem :/

rafael-sales-brisa avatar Jan 30 '25 20:01 rafael-sales-brisa

i have the same problem :/

chanphiromsok avatar Feb 03 '25 02:02 chanphiromsok

please can someone look into this?

tobenna-wes-re avatar Mar 06 '25 20:03 tobenna-wes-re

I've added this is my tsconfig.json until the problem is solved

"paths": {
    "react-native-qrcode-styled": [
      "node_modules/react-native-qrcode-styled/lib/typescript/module/src/index.d.ts"
    ]
  }

3dotline avatar Mar 19 '25 12:03 3dotline

Anyone got any idea how to actually fix this? I have tried taking the patch version, I have tried adding various things to the tsconfig, but nothing stops the error.

royletron avatar Mar 19 '25 17:03 royletron

Actually I managed to find it, pretty straight forward in the end. If you use patch-package you can just apply the following diff:

diff --git a/node_modules/react-native-qrcode-styled/src/index.tsx b/node_modules/react-native-qrcode-styled/src/index.tsx
index 32c627e..7918df0 100644
--- a/node_modules/react-native-qrcode-styled/src/index.tsx
+++ b/node_modules/react-native-qrcode-styled/src/index.tsx
@@ -21,6 +21,8 @@ export {
   isCoordsOfBottomLeftInnerEye,
 } from './helpers';
 
-export { SVGGradient, SVGQRCodeStyledProps, SVGGradientProps };
+export { SVGGradient };
+
+export type {SVGQRCodeStyledProps, SVGGradientProps}
 
 export default QRCodeStyled;

royletron avatar Mar 19 '25 17:03 royletron

We created a lib based on this fork with the fix.

collect-fork-react-native-qrcode-styled

You can use this one till the official lib will be maintained again. 🍻

Seras3 avatar Mar 19 '25 20:03 Seras3

Anyone got any idea how to actually fix this? I have tried taking the patch version, I have tried adding various things to the tsconfig, but nothing stops the error.

I think it's essential to set the baseUrl for everything to function correctly. I'll provide my entire TypeScript configuration below for reference, or consider adding a '.' at the start of the path.

{
  "extends": "expo/tsconfig.base",
  "compilerOptions": {
    "strict": true,
    "baseUrl": "./",
    "composite": true,
    "paths": {
      "react-native-qrcode-styled": [
        "node_modules/react-native-qrcode-styled/lib/typescript/module/src/index.d.ts"
      ]
    }
  },
}

// tsconfig.base
{
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "Expo",

  "compilerOptions": {
    "allowJs": true,
    "esModuleInterop": true,
    "jsx": "react-native",
    "lib": ["DOM", "ESNext"],
    "moduleResolution": "node",
    "noEmit": true,
    "resolveJsonModule": true,
    "skipLibCheck": true,
    "target": "ESNext"
  },
  "exclude": ["node_modules", "babel.config.js", "metro.config.js", "jest.config.js"]
}

3dotline avatar Mar 19 '25 20:03 3dotline

We created a lib based on this fork with the fix.

collect-fork-react-native-qrcode-styled

You can use this one till the official lib will be maintained again. 🍻

I actually tried your lib, but it had the same problem. Only my comment above worked for me.

royletron avatar Mar 21 '25 09:03 royletron

We created a lib based on this fork with the fix. collect-fork-react-native-qrcode-styled You can use this one till the official lib will be maintained again. 🍻

I actually tried your lib, but it had the same problem. Only my comment above worked for me.

With:

npm install collect-fork-react-native-qrcode-styled

and make sure you are using:


import QRCodeStyled from 'collect-fork-react-native-qrcode-styled'

?

Seras3 avatar Mar 21 '25 09:03 Seras3

We created a lib based on this fork with the fix. collect-fork-react-native-qrcode-styled You can use this one till the official lib will be maintained again. 🍻

I actually tried your lib, but it had the same problem. Only my comment above worked for me.

With:

npm install collect-fork-react-native-qrcode-styled

and make sure you are using:


import QRCodeStyled from 'collect-fork-react-native-qrcode-styled'

?

Yeah, I tried using your package too and got same error. Only the patch above worked.

dayaki avatar Apr 07 '25 21:04 dayaki

collect-fork-react-native-qrcode-styled

working well thanks

fridolinf avatar Jun 28 '25 17:06 fridolinf

I did create a react-native-qrcode-styled.d.ts:

// The package ships with TypeScript declarations but doesn't properly declare them in package.json
declare module 'react-native-qrcode-styled' {
  export * from 'react-native-qrcode-styled/lib/typescript/module/src/index';
  export {default} from 'react-native-qrcode-styled/lib/typescript/module/src/index';
}

artola avatar Jun 29 '25 19:06 artola

@tokkozhin is this package maintained? Im trying to figure out if i can trust basic issues like broken TS declarations to be fixed. So far 6 months passed by and it looks like its not.

pavelloz avatar Aug 14 '25 07:08 pavelloz

@pavelloz I didn't have time to work on the library. I'll try to update it soon.

tokkozhin avatar Aug 27 '25 23:08 tokkozhin

Guys, check out 0.4.0

tokkozhin avatar Aug 28 '25 00:08 tokkozhin