Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TypeScript warning: missing types #226

Open
AndreCosta101 opened this issue Feb 28, 2021 · 5 comments
Open

TypeScript warning: missing types #226

AndreCosta101 opened this issue Feb 28, 2021 · 5 comments

Comments

@AndreCosta101
Copy link

Hi,

I'm getting a message for types missing.

I couldn't install the @types package, so I guess there isn't one.

Alternatively, it asks to add a new declaration. Can anyone help me with that? I have no idea how to do it. Thanks

Could not find a declaration file for module 'react-native-progress/Bar'. '/Users/[...]/node_modules/react-native-progress/Bar.js' implicitly has an 'any' type.
Try npm i --save-dev @types/react-native-progress if it exists or add a new declaration (.d.ts) file containing declare module 'react-native-progress/Bar';ts(7016)

@rimselis
Copy link

rimselis commented Mar 9, 2021

I'm getting an error Could not find a declaration file for module 'react-native-progress/Bar'. when importing ProgressBar directly using import ProgressBar from 'react-native-progress/Bar';.

@ericdsw
Copy link

ericdsw commented Mar 26, 2021

You could try importing it like this:

import { Bar as ProgressBar } from 'react-native-progress';

const MyComponent = () => (
  <ProgressBar progress={0.5} /> // <--- Should auto complete props
);

You should have no problems with tree shaking configured in your project.

@soliloquyx
Copy link

soliloquyx commented Oct 15, 2021

You could try importing it like this:

import { Bar as ProgressBar } from 'react-native-progress';

const MyComponent = () => (
  <ProgressBar progress={0.5} /> // <--- Should auto complete props
);

You should have no problems with tree shaking configured in your project.

This still requires react-native-svg to be installed.

They way I solved it:

  1. I created a types folder inside my src folder, then react-native-progress folder and inside there index.d.ts file with
    declare module 'react-native-progress/Bar'

@GunnarAK
Copy link

GunnarAK commented Jan 28, 2022

@soliloquyx 's solution worked fine for me in the beginning, but when revisiting the project I find myself fiddling with this error again. I will just start messing around with things and after a while it will suddenly start working again (??). This happens often.

Things I do:

  • delete watcher cache
  • reset metro cache
  • delete node_modules and reinstall
  • messing around with progressbar import in ProgressScreen.js
error: Error: Unable to resolve module react-native-svg from /Users/.../node_modules/react-native-progress/Circle.js: react-native-svg could not be found within the project or in these directories:
  node_modules
  ../../../node_modules

My setup:

import React from 'react';
import { Modal, View } from 'react-native';
import { Bar as ProgressBar } from 'react-native-progress';

type Props = {
  onDone: () => void;
  progress: number;
  visible: boolean;
};

function ProgressScreen({ progress = 0, visible = false }: Props) {
  return (
    <Modal visible={visible}>
      <View style={styles.container}>
        <ProgressBar color={colors.primary} progress={progress} width={200} />
      </View>
    </Modal>
  );
}

export default ProgressScreen;

types/react-native-progress/index.d.ts:

// Fix for not requiring react-native-svg: https://github.com/oblador/react-native-progress/issues/226#issuecomment-944223473
declare module 'react-native-progress/Bar';

My issue sounds a lot like #26, but his fix did not work for me. Any suggestions?

@Rishabh-Chowdhry
Copy link

so can we use it using typescript or not

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants