> 웹 프론트엔드 > JS 튜토리얼 > Create React App의 `src` 디렉터리 외부에서 자산을 어떻게 가져올 수 있나요?

Create React App의 `src` 디렉터리 외부에서 자산을 어떻게 가져올 수 있나요?

Mary-Kate Olsen
풀어 주다: 2024-11-27 17:32:11
원래의
463명이 탐색했습니다.

How Can I Import Assets from Outside the `src` Directory in Create React App?

create-react-app Src 디렉터리 외부 가져오기 제한 극복

create-react-app 활용 시 이미지 등 자산에 액세스 src 디렉토리 외부의 폴더에서 "모듈을 찾을 수 없음" 오류가 발생할 수 있습니다. 이 제한은 명확한 프로젝트 구조를 유지하고 코드 보안을 보장하기 위해 create-react-app에 내재되어 있습니다.

제한 이유

create-react-에 구현된 ModuleScopePlugin 앱은 앱의 src 디렉터리에서 상대 가져오기가 그 이상으로 확장되어서는 안 된다는 제한을 적용합니다. 이렇게 하면 자산이 프로젝트의 설정된 경계 내에 유지됩니다.

비공식 솔루션

공식 입장에서는 create-react-app을 종료하지 않고는 이 제한을 비활성화할 수 없다는 것입니다. , 몇 가지 비공식 솔루션이 존재합니다. 그러나 제거하면 향후 업데이트 및 기능에 대한 액세스를 잃을 위험이 있습니다.

  • 재배선: 이 도구를 사용하면 제거하지 않고도 웹팩 구성을 프로그래밍 방식으로 수정할 수 있지만 ModuleScopePlugin을 제거할 수 있습니다. 플러그인을 사용하지 않는 것이 좋습니다.
  • React-app-alias: 더 나은 접근 방식은 다음과 같습니다. ModuleScopePlugin으로 보호되는 src와 유사한 모든 기능을 갖춘 디렉터리를 추가합니다.

권장 접근 방식

공용 폴더에서 가져오는 대신 src 폴더의 자산입니다. 이는 다음과 같은 여러 가지 이점을 제공합니다.

  • 최적의 패키지 다운로드 크기
  • webpack의 최적화된 청크 로딩으로 인한 로딩 효율성 향상
  • 단일 URL을 통한 일관된 자산 가용성

이러한 지침을 준수함으로써 개발자는 수입 제한을 피하고 제품의 무결성과 성능을 유지할 수 있습니다. create-react-app으로 구축된 애플리케이션.

위 내용은 Create React App의 `src` 디렉터리 외부에서 자산을 어떻게 가져올 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿