节点模块导入具有类型声明的函数



我正在尝试创建一个用于Expo项目的monoreo。为了简单起见,我只包括我认为你需要了解我所做的信息。

文件结构

├── monorepo
│   ├── package.json
│   ├── apps
│   │   ├── myapp
│   │   │   └── App.tsx
│   ├── packages
│   │   │── mylib
│   │   │   │── package.json
│   │   │   │── index.ts
│   │   │   │── index.d.ts
│   │   │   │── test.js

myapp/App.tsx

import { StatusBar } from "expo-status-bar";
import React from "react";
import { StyleSheet, Text, View } from "react-native";
import { testing } from "mylib"; << This does not import the function
export default function App() {
return (
<View style={styles.container}>
<Text>{testing}</Text>
<StatusBar style="auto" />
</View>
);
}

mylib/package.json

{
"name": "mylib",
"main": "index.ts",
"types": "index.d.ts",
...
}

mylib/index.ts

export default "hello from mylib";

mylib/index.d.ts

export * from "./test";

mylib/test.js

export function testing() {
return "hello";
}

在App.tsx中,如果我在不使用花括号的情况下执行import testing from "mylib",它将把testing视为mylib/index.ts的默认导出,并打印";你好,来自mylib";在屏幕上。接下来,我想实际导入测试函数,所以我做了import { testing } from "mylib",但它不能识别testing函数。

如何从包中正确导入函数?我错过了什么?

更新

我相信我遇到的问题与我实际上是从index.ts导入有关,无论我的申报文件如何。由于index.ts只有一个值的默认导出,所以它不知道我要从那里导入什么。我需要弄清楚声明文件如何与实际的javascript函数代码一起工作。

例如,如果我将index.ts更改为export * from "./test";,并将App.tsx编辑为:

import { StatusBar } from "expo-status-bar";
import React from "react";
import { StyleSheet, Text, View } from "react-native";
import { testing } from "mylib";
export default function App() {
return (
<View style={styles.container}>
<Text>{testing()}</Text>
<StatusBar style="auto" />
</View>
);
}

那么它将按预期工作

如果是node_modules目录中已安装的程序包,则只能从程序包名称导入。在您的情况下,您必须从这样的相对文件路径导入:

import { testing } from "../../packages/mylib/test";

我想分享一篇关于节点模块和类型的好文章

它帮助我理解了我没有得到什么。从本质上讲,我将类型声明文件视为应该导出函数的入口点文件。在我的例子中,我的函数已经有了类型定义,所以甚至不需要向模块添加类型声明文件。

最新更新