在react-create-app中導入的組件轉換爲「/ static」url

Question

我遇到問題我找不到任何以前的答案或有關文檔。

我加載一個組成部分，在一個模塊中，我的本地機器， 「login.jsx，」 關於爲 「index.js」：

import Login from './login'; 

export { Login }; 

導出組件內部 「login.jsx」是非常基本的。

模塊主要指向index.js文件，我將它導入由create-react-app生成的「App.js」文件中。

模塊的目錄結構如下：

module 
    | src 
    | --- components 
    | --- --- login.jsx 
    | --- --- index.js 
    | package.json  

值得一提的是，這也是一個創建反應的應用內，但沒有將所生成的文件是的主要出口的部分鏈接模塊。

當我導入它和console.log時，它以字符串形式導入：「/static/media/login.1d0b2e37.jsx。」

具體來說，我得到的錯誤是：

Invalid tag: /static/media/login.1d0b2e37.jsx 

因爲我試圖進口加載：

import { Login } from 'component-module'; 

直接進入反應路由器-DOM路線。直接位於我的create-react-app文件夾「src」中的所有組件都呈現得很好。

當日志：

console.log(Login); 

在導入後，它立即清楚，這是一個字符串：「/static/media/login.1d0b2e37.jsx」

我創建反應的-應用項目的目錄結構（一個通用的創建反應的-APP）：

create-react-app 
    | src 
    | --- App.js 

在它存在的上述進口，這是導致進口Login作爲一個字符串。

這裏有一些奇怪的事情發生在外部組件的create-react-app開發服務器渲染嗎？也許在一個Webpack插件中，只是將外部對象視爲靜態對象？

據我所知，有這個在create-react-app docs

Answer 1

沒有信息通過模塊，你的意思庫？在某些情況下，您可以通過npm install將其作爲其他應用程序的依賴項進行安裝？

如果是這樣，CRA不是爲此目的而設計的。它旨在用於創建應用程序。

如果你真的認爲有必要創建一個登錄組件庫，並希望這樣做使用CRA，您可以按照本指南：https://medium.com/@lokhmakov/best-way-to-create-npm-packages-with-create-react-app-b24dd449c354或使用this tool，雖然我從來沒有嘗試過自己，並不能保證它。

雖然有作爲一個庫實現你的組件的好理由嗎？ 庫主要用於與開發人員共享通用功能，以用於各自的應用程序。

如果您只打算在您的特定應用中使用此組件，我會建議將其作爲您的應用中的一個組件實現。您仍然可以將其作爲獨立庫實現，但不需要設置構建邏輯。

create-react-app 
|src 
| App.js 
| components 
|  Login 
|   index.js 
|   Login.jsx 

而且在App.js import Login from './components/Login