时间戳

首页 > 解决方案 > 如何在 React 中解决这个加载程序问题？

reactjs - 如何在 React 中解决这个加载程序问题？

问题描述

我想使用来自GitHub的这个弹出组件

我使用 npm 安装了它（否则我不知道该怎么做）。我将它导入到我的 App.js

import { Root, Popup } from 'popup-ui'

导入后，我收到以下消息：

找不到模块“popup-ui”的声明文件。

'c:/Repos/Budgeteer/node_modules/popup-ui/index.js' 隐含了一个 'any' 类型。

尝试npm install @types/popup-ui它是否存在或添加一个包含 `declare module'popup-ui' 的新声明 (.d.ts) 文件；

`ts(7016)

@types/popup-ui 不存在。我不知道声明是什么意思（这里是菜鸟）。我查了一下 ts(7016)，作为一个初学者，我又不知道该怎么做。

编译时，我遇到了这个问题：

C:/Repos/Budgeteer/node_modules/popup-ui/src/basic/Popup/index.js 10:1

模块解析失败：意外令牌 (10:1)

您可能需要适当的加载程序来处理此文件类型，目前没有配置加载程序来处理此文件。

见https://webpack.js.org/concepts#loaders

这段代码带有错误：

|   static popupInstance
| 
>   static show({ ...config }) {"
|       this.popupInstance.start(config)
|   }

我查看了链接并阅读了加载程序，但我不知道我需要安装什么类型的加载程序，如何安装它或如何编辑该 webpack 文件。我什至找不到它。

任何帮助将不胜感激。但是请尽量让它尽可能详细，因为我对这一切都是新手。

另外，如果这很重要，我正在将 React Native 与 Expo 一起使用。干杯。

标签： reactjstypescriptreact-nativewebpackloader

解决方案

如果 webpack 正在运行tsc（Typescript 编译器）并且它在抱怨 a .d.ts，那很奇怪。如果 Webpack 说“我没有为 .d.ts 文件定义加载器”，这意味着某些东西正在尝试require.d.ts，这永远不会发生。

当人们定义了广泛的上下文时，我遇到了这个问题，无论是 viarequire.context(/too-many-files.*\.ts/)还是 require("/some/path/" + fileName). Webpack 将尝试静态分析后一个语句，并将（或多或少）视为require.context(/\/some\/path\/.*/)

.d.ts无论哪种方式，你都会在不应该的时候抓取文件。如果您可以修复require/require.context使其排除类型，请执行此操作。如果不能，请添加一条规则，例如{test: /\.d\.ts$/, use: "null-loader"}

推荐阅读