找不到模塊：無法解析“react-icons/ai”

Question

我正在學習ReactJS。但是現在我遇到了一個問題。 我用這個代碼

import { AiOutlineShoppingCart } from "react-icons/ai"

但它顯示此錯誤：

Module not found: Can't resolve 'react-icons/ai'

我正在使用 sanity 來構建電子商務網站 cms。 我試圖用這段代碼安裝反應圖標

yarn add react-icons

並且我已經檢查了 packages.jeson 文件並且 react-icons 存在於依賴項中。 誰能告訴我如何解決這個問題？

一些額外的信息：

• 我也使用 react-icons 而不是 react-icons/ai 但同樣的錯誤
• 我已經使用 npm install 來安裝 react-icons。 沒有任何幫助

Answer 1

首先，您應該知道並非所有圖標都可用。 我有時嘗試導入一些圖標，但我得到了錯誤。

其次，確保您從網站復制代碼，以確保您沒有拼錯名稱

此外，您可以從 package.json 文件中刪除您的 node_module 並刪除 react-icons，然后執行yarn add react-icons並執行 yarn 以再次安裝所有包

最后，你要從擁有圖標的庫中導入，即如果你從AiFillAudio導入，你要從react-icons/ai導入它。 例如。 import { AiFillAudio } from react-icons/ai 。

我希望這可以幫助你。

Answer 2

嘗試使用npm install react-icons --save命令重新安裝

Answer 3

我想到了。 我的反應圖標安裝在文件夾中。 因此，當我從 react-icons 導入 AiOutlineShoppingCart 時，我的程序正在我的主文件的 node_module 中尋找 react-icons。 但它存儲了健全的node_module。 所以我必須聲明整個路徑。

工作代碼是

import { AiOutlineShoppingCart } from "../sanity/node_modules/react-icons/ai"

此處，“sanity”表示 sanity 文件夾名稱。

謝謝大家幫助我。

Answer 4

當您在錯誤的目錄中安裝依賴項時，有時會發生這種情況。

假設您在項目目錄外運行npm i package-x