Mapowanie ścieżek maszynopisu dla React Native * .android.ts i * .ios.ts modules

Question

Używam Typeescript (wersja 2.2.1) w VSCode (wersja 1.10.2) do mojego projektu Native Native i próbuję aby uzyskać kompilator map * * .ios.ts .android.ts i ścieżki postępując zgodnie z instrukcjami na stronie:

https://github.com/Microsoft/TypeScript-Handbook/blob/release-2.0/pages/Module%20Resolution.md#path-mapping

na przykład:

import ApplicationTabs from './ApplicationTabs'; 

należy mapować do

import ApplicationTabs from './ApplicationTabs/index.ios'; 

z następującymi ustawieniami tsconfig.json

{ 
    "compilerOptions": { 
     "paths": { 
      "*": ["*", "*.ios", "*.android"] 
     } 
    } 
} 

lecz rzuca kompilator zgłasza błąd „[ts] Nie można odnaleźć modułu” ./ApplicationTabs'”

Czy ktoś wie jak mogę dostać kompilator do mapowania ścieżek * .android.ts i * .ios.ts poprawnie?

Moja tsconfig.json jest:

{ 
    "compilerOptions": { 
     "target": "es6", 
     "module": "es6", 
     "moduleResolution": "node", 
     "jsx": "react", 
     "outDir": "build", 
     "rootDir": "src", 
     "removeComments": true, 
     "allowSyntheticDefaultImports": true, 
     "noImplicitAny": true, 
     "experimentalDecorators": true, 
     "preserveConstEnums": true, 
     "allowJs": true, 
     "inlineSourceMap": true, 
     "sourceRoot": "src", 
     "baseUrl": ".", 
     "paths": { 
      "*": [ 
       "*", 
       "*.ios", 
       "*.android" 
      ] 
     } 
    }, 
    "filesGlob": [ 
     "typings/**/*.d.ts", 
     "src/**/*.ts", 
     "src/**/*.tsx", 
     "src/**/*.tsx" 
    ], 
    "exclude": [ 
     "index.android.js", 
     "index.ios.js", 
     "build", 
     "node_modules" 
    ], 
    "compileOnSave": false 
} 

Dzięki :-)

Answer 1

Zalecenia tutaj jest wykorzystanie wsparcia odwzorowania ścieżki, patrz https://github.com/Microsoft/TypeScript-Handbook/blob/release-2.0/pages/Module%20Resolution.md#path-mapping

więc tsconfig.json powinien zawierać coś takiego:

{ 
    "compilerOptions": { 
     "paths": { 
      "*": ["*", "*.ios", "*.android"] 
     } 
    } 
} 

to powie komp kompilatorowi n rozwiązywania importu do BigButton patrzeć:

BigButton.tsx

BigButton.ios.tsx

BigButton.androdid.tsx

Answer 2

Wygląda jak używasz do kwestii zgłoszonych tutaj : https://github.com/Microsoft/TypeScript/issues/8328

W zależności od problemu (i tego, co znalazłem w moich własnych projektach), ścieżka nie działa dla względnych ścieżek, tak jak to, co robisz w powyższym kodzie. Również nie dostać typu sprawdzanie między .android i .ios plików, więc używam inne podejścia omawianego w numerze:

./ApplicationTabs.d.ts

// This file exists for two purposes: 
// 1. Ensure that both ios and android files present identical types to importers. 
// 2. Allow consumers to import the module as if typescript understood react-native suffixes. 
import DefaultIos from './ApplicationTabs.ios'; 
import * as ios from './ApplicationTabs.ios'; 
import DefaultAndroid from './ApplicationTabs.android'; 
import * as android from './ApplicationTabs.android'; 

declare var _test: typeof ios; 
declare var _test: typeof android; 

declare var _testDefault: typeof DefaultIos; 
declare var _testDefault: typeof DefaultAndroid; 

export * from './ApplicationTabs.ios'; 
export default DefaultIos;