ds300 / react-native-typescript-transformer

Seamlessly use TypeScript with React Native
MIT License
657 stars 50 forks source link

The baseurl and paths defined in tsconfig.json don't work #24

Closed afshin-hoseini closed 7 years ago

afshin-hoseini commented 7 years ago

This is my tsconfig.json file:

{
  "compilerOptions": {
    "target": "es2015",
    "module": "es2015",
    "jsx": "react-native",
    "moduleResolution": "node",
    "allowSyntheticDefaultImports": true
    ,
    "sourceMap": true
    ,"baseUrl": ".",
    "paths": {
      "Models/Plan" : [

        "src/Models/Plan"
      ]
    }

  }
}

But I can't figure out why this import doesn't work:

import Plan from 'Models/Plan'

The plan.ts file is like:

export default class Plan{

}
ds300 commented 7 years ago

You also need to configure react-native for resolving absolute paths. I've done it before but can't remember exactly how. Something to do with extra json files. Can't check right now but will comment again in a couple of hours with more guidance if you still need it.

On 31 Jul 2017 7:24 am, "Afshin Hoseini" notifications@github.com wrote:

This is my tsconfig.json file:

{ "compilerOptions": { "target": "es2015", "module": "es2015", "jsx": "react-native", "moduleResolution": "node", "allowSyntheticDefaultImports": true , "sourceMap": true ,"baseUrl": ".", "paths": { "Models/Plan" : [

    "src/Models/Plan"
  ]
}

} }

But I can't figure out why this import doesn't work:

import Plan from 'Models/Plan'

The plan.ts file is like:

export default class Plan{

}

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/ds300/react-native-typescript-transformer/issues/24, or mute the thread https://github.com/notifications/unsubscribe-auth/ABL1qRtSuGPIXUTqNNlDkSLLuISnVgu8ks5sTXMMgaJpZM4On8uC .

afshin-hoseini commented 7 years ago

@ds300 Yeah sure I'm new to react-native and I'll need a lot of help...

Thank you for your support.

ds300 commented 7 years ago

I followed this method: https://medium.com/@davidjwoody/how-to-use-absolute-paths-in-react-native-6b06ae3f65d1

i.e. placing a package.json file containing only {"name": "src"} in my src folder, and then importing everything from "src/foo" or "src/bar/baz" etc.

You could also try that babel plugin mentioned at the bottom. Seems promising.

afshin-hoseini commented 7 years ago

@ds300 Thank you.