React js에서 경로 별칭 만들기

(2020 년 9 월 13 일)

이 자습서는 반응 프로젝트의 경로 별칭을 만드는 방법을 안내합니다. 자산 또는 구성 요소에 대한 경로 별칭을 만들면 코드가 더 깨끗하고 예쁘게 보입니다. 예를 들어 아래의 전후 이미지를보십시오.

이전
이후

더 깔끔해 보이지 않나요? 이것은 프로젝트가 크고 많은 파일과 구성 요소를 파일로 가져와야하는 경우에 적합합니다. 이제 react js에서 경로 별칭을 만드는 방법을 시작하겠습니다.

요구 사항

  1. 프로젝트 루트 디렉토리에 터미널을 설치하고 react-app-rewired react-app-rewire-alias 개발자 종속성으로.
npm install react-app-rewired react-app-rewire-alias --save-dev

2. 이제 루트 디렉터리 내에 config-overrides.js 라는 이름의 파일을 만들고 아래 코드를 붙여 넣습니다.

여기서 먼저 {alias} iv id를 가져옵니다. react-app-rewire-alias의 = “e9d21c722e”>

. 그 후 별칭 여기서 키는 경로 정의이고 값은 경로입니다. 서로 다른 정의 및 경로에 대해 여러 키-값 쌍을 추가 할 수 있습니다.

3. 이제 package.json 파일을 열고 react-scriptsreact-app-rewired

4. 이제 React js 프로젝트 내에서 새 별칭을 사용할 수 있습니다.

5. 프로젝트 npm start를 시작하여 작동하는지 확인하세요.

아래는 참조 용 Github 저장소입니다.

Mediumtutorial / path-aliases-react-medium

이 프로젝트는 Create React App으로 부트 스트랩되었습니다. 프로젝트 디렉토리에서 다음을 실행할 수 있습니다. 앱 실행…

github.com