使用打字稿在 Expo 40+ 中加载降价文件

Question

在 Expo 40 中，我需要从本地包中加载 markdown 文件。我也在使用打字稿。

我发现this post 描述了一个解决方案，但assetsExt App.json 键似乎不再起作用。

我尝试按照 typescript 提示添加声明并将其添加到我的 tsconfig 中，这让 typescript 可以找到它，但是当我加载我的 react-native 应用程序时，它仍然无法解析该应用程序：

Unable to resolve module ./../../../assets/SOME_MARDOWN.md from /app/xxxx/SOME_COMPONENT.tsx:
None of these files exist:
...

Answer 1

在 40 世博会 - 我是这样让它运行的！ Expo website source without typescript.

注意您必须将文件放在assets 目录中，并确保您的app.json 指定所有需要的扩展名，我的包含所有内容："assetBundlePatterns": ["**/*"],

首先，我将它分为两​​部分 - 让 Expo 工作，然后让 typescript 工作。

Expo 很简单，但只有当我意识到这是问题所在时。我遵循了上述指南。总结：

1. expo install @expo/metro-config
2. 创建一个metro.config.js 并使用您尝试添加的任何扩展名调用push 方法，在我的例子中是md（降价）：

const { getDefaultConfig } = require('@expo/metro-config');

const defaultConfig = getDefaultConfig(__dirname);

defaultConfig.resolver.assetExts.push('md');

module.exports = defaultConfig;

1. 在博览会上重置缓存（在运行它的终端窗口中按 shift + r，在 Mac 上）

Typescript (4) 记录在其他地方：

1. 创建声明 (*.d.ts) 文件，将 markdown 指定为有效扩展名：declare module "*.<SOME_COOL_FILE_EXTENSION>"
2. 确保该文件位于我的tsconfig.json 根目录之一（在compilationOptions -> "include" 键中列出）。
3. 将该文件添加到typeRoot 下的compilationOptions tsconfig.json
4. 在我的组件中导入/要求md

对我来说，这些步骤最终是：

1. 在./app/declaration.d.ts 中添加一个文件，其中仅包含：declare module "*.md"
2. 我的"include" 中有app 目录，看起来像这样： "include": ["App.js", "app", "test", "storybook"]
3. 我将此添加到compilationOptions："typeRoots":["./app/declaration.d.ts"],
4. import newborn from './../../../assets/resources/MY_MD_DOC.md'

多田！