반입 된 구성 요소가 react-create-app의 "/ static"URL로 변환되었습니다.

Question

문제점이 있습니다. 이전의 응답 또는 문서를 찾을 수 없습니다.

는 나는 "하는 index.js"로 내 로컬 컴퓨터, "login.jsx"에, 모듈에서, 구성 요소를로드 해요 :

import Login from './login'; 

export { Login }; 

내 보낸 구성 요소 "login.jsx"내부 매우 기본입니다.

main은 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 

내가 가져 오기로드를 시도하고 있기 때문에 : 직접 반응 라우터-DOM을 경로로

import { Login } from 'component-module'; 

합니다. 내 create-react-app 폴더 인 "src"에 직접있는 모든 구성 요소는 정상적으로 렌더링됩니다.

로깅 : 가져 오기 후

console.log(Login); 

는, 문자열입니다 즉시 분명하다 ". /static/media/login.1d0b2e37.jsx가"

내 생성 - 반응 - 응용 프로그램 프로젝트의 디렉토리 구조는 (일반적인 만들-반응 - 응용 프로그램)입니다 : 문자열로 Login를 가져 오는 결과입니다 전술 가져 오기를, 존재

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

하는.

외부 부품의 생성 - 반응 - 앱 개발 서버 렌더링과 관련하여 여기에 이상한 점이 있습니까? 어쩌면 Webpack 플러그인 중 하나에서 외부를 정적으로 처리하는 것일까?

는

지금까지 내가 말할 수있는, 모듈함으로써 create-react-app docs

Answer 1

이에 대한 정보가없는, 당신은 도서관을 의미합니까? 뭔가로 npm 설치를 통해 다른 애플 리케이션에 대한 의존성으로 설치할 수 있습니까?

그렇다면 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에

는