与打字稿本机反应的平台特定导入组件 [英] Platform specific import component in react native with typescript

问题描述

我正在使用带有打字稿的本机反应.我有一个具有以下结构的组件

I am using react native with typescript. I have a component with the following structure

component
    - component.ios.tsx
    - component.android.tsx

现在我想导入组件.所以，我这样做:

Now I want to import the component. So, I am doing this:

import component from '../component/component';

但它说:

[ts] Cannot find module ../component/component

位置正确.我需要在 tslint 文件中添加一些内容以使其理解.

The location is correct. I need to add something to the tslint file to make it understand.

我也尝试过:

let component = require('../component/component');

这没有给出打字稿错误.但它给出了一个运行时错误.

This didn't give typescript error. But it gave a runtime error.

element type is invalid expected a string or a class/function but got undefined

有人遇到过这个问题吗?谢谢.

Has anybody run into this issue? Thank you.

推荐答案

一种有点烦人的方法是创建一个同名的声明文件.

One way of doing it, which is a bit annoying, is creating a declaration file with the same name.

component
- component.d.ts   <---
- component.android.tsx
- component.ios.tsx

然后

import { file } from "../group/file";

更新:另一种方法是省略其中一个的扩展名，然后打字稿会选择默认的.

Update: Another way of doing it is just omit the extension for one of them, then typescript will pick up the default one.

• component.tsx
• component.android.tsx

Android 会选择特定的 android 文件，iOS 会默认为普通文件.

Android will pick up the specific android file, and iOS will default to normal one.

这篇关于与打字稿本机反应的平台特定导入组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！