Typings are broken in the most recent version

[ericpoulinnz]

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.

[PvanHengel]

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",

[rafael-sales-brisa]

i have the same problem :/

[chanphiromsok]

i have the same problem :/

[tobenna-wes-re]

please can someone look into this?

[3dotline]

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"
    ]
  }

[royletron]

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]

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;

[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. 🍻

[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.

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"]
}

[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.

[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'

?

[dayaki]

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.

[fridolinf]

collect-fork-react-native-qrcode-styled

working well thanks

[artola]

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';
}