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

Don't let typescript get confused #114

Open
AdrienLemaire opened this issue Nov 6, 2018 · 3 comments
Open

Don't let typescript get confused #114

AdrienLemaire opened this issue Nov 6, 2018 · 3 comments

Comments

@AdrienLemaire
Copy link

Can we add an equivalent to the flow setup for typescript ?

[options]
module.name_mapper='^{rootPathPrefix}/\(.*\)$' -> '<PROJECT_ROOT>/{rootPathSuffix}/\1'

Being new to typescript, I'm not sure how this should be solved.

TS2307: Cannot find module '~/constants'.
Version: typescript 3.1.6      
@brigand
Copy link
Collaborator

brigand commented Nov 6, 2018

This might be wrong... but try the vscode instructions. I remember hearing typescript also reads that file.

I'm happy to update the readme if there's a known working solution.

@AdrienLemaire
Copy link
Author

AdrienLemaire commented Nov 6, 2018

I searched a bit and found 2 related resources

https://github.com/niieani/typescript-vs-flowtype#mapping-dynamic-module-names
But I didn't understand how to setup a .d.ts file for that purpose

https://www.typescriptlang.org/docs/handbook/module-resolution.html
Indeed, this looked very much like your VSCode example

So I added in my tsconfig.json

{
  "compilerOptions": {
    
    "baseUrl": ".",
    "paths": {
      "~/*": ["src/*"]
    }
  },
  
}

And I could build without getting an error :')

@allandiego
Copy link

allandiego commented Apr 17, 2020

Is there any additional configuration for typescript?

My project was expo javascript and the plugin was working fine with this configurations:

Project structure:

Myproject
  - src/
    AppRoot.js
    - error/
      ErrorBoundary.js
    -all project code inside src
  package.json
  jsconfig.json

jsconfig.json

{
  "compilerOptions": {
  "baseUrl": "src", 
    "paths": {
      "~/*": ["*"]
    },
}

babel.config.js

plugins: [
      ['babel-plugin-root-import',
        {
          "rootPathSuffix": "src",
          "rootPathPrefix": "~"
        }
      ],
    ],

Import use AppRoot.js

import ErrorBoundary from '~/error/ErrorBoundary';

Then i converted to typescript, replaced jsconfig to tsconfig, and geting error to resolver when running the app

Unable to resolve "../error/ErrorBoundary" from "src\AppRoot.tsx"

Vscode typescript is working fine, it resolves the path in intellisense so i think im missing something in babel.config.js

importing without slash it works

import ErrorBoundary from '~error/ErrorBoundary';

in javascript it was working with slash ~/ in typescript its trying to lev one directory up ../ any ideia how to fix that?

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

3 participants