如何在 Create React App 中匯入 `src` 目錄以外的模組而不彈出？

克服Create-React-App 中src 目錄之外的導入限制

Create-React-App (CRA) 強制執行嚴格的導入規則，防止模組在src 目錄之外導入。從其他目錄（例如公用資料夾）存取檔案時，此限制會導致錯誤。

了解 ModuleScopePlugin

CRA 中的 ModuleScopePlugin 外掛程式可確保應用程式原始碼匯入保持不變限制在 src 資料夾內。該插件可防止外部模組訪問，確保一個封閉且安全的應用程式環境。

非彈出解決方案

官方，繞過此限制需要從 CRA“彈出”，允許直接訪問底層 webpack 配置的進程。但是，彈出會帶來無法存取未來 CRA 功能和更新的風險。

不要彈出，請考慮以下非官方解決方案：

• 重新接線： 使用rewire 套件動態修改 webpack 配置。雖然這允許在 src 之外存取模組，但不建議這樣做，因為它會削弱插件保護。
• react-app-alias: 該程式庫建立了額外的類似 src 的目錄，這些目錄也包含在ModuleScopePlugin。這在保持安全性的同時增加了靈活性。

避免從公用資料夾匯入

從公用資料夾匯入資源效率低下，因為它們會在建置中重複資料夾。相反，將資源儲存在 src 中以優化套件大小和載入效率。

以上是如何在 Create React App 中匯入 `src` 目錄以外的模組而不彈出？的詳細內容。更多資訊請關注PHP中文網其他相關文章！