Coder Social home page Coder Social logo

Comments (9)

jamesopti avatar jamesopti commented on June 18, 2024 1

I ran into the same issue! Here was my workaround:

#
# Helper script to generate a master Typescript definition file.
#
INPUT_FILES=src/components/*/index.js
OUTPUT_FILE=types/index.d.ts
regex='src/components/([A-Za-z]+)/index.js'

# Initialize the output file with a header
cat > $OUTPUT_FILE <<- EOM
// Type definitions for <my project>
// Project: <my project>
// Definitions by:

/// <reference types="my-project" />

EOM

# Loop through all input files and run react2dts on them,
# concatenating the output to our single output file
for file in $INPUT_FILES; do
  [[ $file =~ $regex ]]
  comp_name=${BASH_REMATCH[1]}
  $(npm bin)/react2dts --file "$file" --name $comp_name >> $OUTPUT_FILE
done

from react-to-typescript-definitions.

KnisterPeter avatar KnisterPeter commented on June 18, 2024

Hi @artyomsv,
all current possible cases are in the various unit tests. Please have a look if there is something which fulfills your requirement. I'm not sure what you mean with do not want to declare module.

Right now it is only possible to create dts for one file at once. But it should be quite simple to eiter loop through them with a simple bash command or use the JS API.

from react-to-typescript-definitions.

artyomsv avatar artyomsv commented on June 18, 2024

@KnisterPeter thanks for quick reply
Regarding declaring the module here is an example:
If I use your tool for JSX file I get something like this:

declare module 'name' {
    import * as React from 'react';

    export interface BaseInputCssModule {
       ...
    }

    export interface BaseInputProps {
        .......
    }

    const BaseInput: React.SFC<BaseInputProps>;

    export default BaseInput;

}

In my case I just want to place dts file together with my widget so I would expect to have index.d.ts file like:

export interface BaseInputCssModule {
  ...
}

export interface BaseInputProps {
  ...
}

declare const BaseInput: React.SFC<BaseInputProps>;

export default BaseInput;

from react-to-typescript-definitions.

KnisterPeter avatar KnisterPeter commented on June 18, 2024

Just add --top-level-module to your cmdline

from react-to-typescript-definitions.

bartholomews avatar bartholomews commented on June 18, 2024

Hello, I am having the same issue, --top-level-module seems to be ignored and it defaults same as I would do react2dts --module-name moduleName, is there something I am missing? Thanks

from react-to-typescript-definitions.

KnisterPeter avatar KnisterPeter commented on June 18, 2024

@bartholomews I have no clue. Can you please add your whole commandline you execute with all parameters and any output you get to this issue?

from react-to-typescript-definitions.

bartholomews avatar bartholomews commented on June 18, 2024

@sinnerschrader I think I have found the issue, it's defaulting only if the flag is set without value, if followed by any value it seems to work:

react2dts-top-level-module-example

So it's not a big deal for us I think 👍

from react-to-typescript-definitions.

KnisterPeter avatar KnisterPeter commented on June 18, 2024

@bartholomews Intersting find. I'll flag this as bug as it should be fixed. But you already have your workaround. Thanks for sharing.

from react-to-typescript-definitions.

stale avatar stale commented on June 18, 2024

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

from react-to-typescript-definitions.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.