Hygen으로 파일 스캐 폴딩

최근에 나는 Smashing Magazine이 권장하는 강력한 CLI 도구 인 Hygen을 발견했으며 다음 Next.js UI Development Workflow의 게임 체인저였습니다. 구성 요소 폴더와 파일의 지속적인 수동 생성은 지루하고 오류가 발생했습니다. Hygen은 간소화 된 솔루션을 제공합니다.

우리 팀은 일관된 구성 요소 구조를 사용합니다.

 <code>/NewComponent index.js NewComponent.js NewComponent.module.scss</code>

이전에는 파일 생성을 위해 VS Code의 UI에 의존했습니다. 느리고 비효율적 인 프로세스. Hygen의 CLI는이를 자동화하고 프로젝트 내에 직접 저장된 템플릿 기반 접근 방식은 팀 전체의 일관성과 유지 관리를 보장합니다.

권장 설치는 글로벌입니다.

 NPM I -G 위생

글로벌 설치가 편리하지만, 지역 설치 ( npm i -D hygen )가 더 나은 프로젝트 제어와 다른 프로젝트의 종속성 문제를 방지하기 위해 바람직 할 수 있습니다. 그러나 CLI 기능은 설치 방법에 관계없이 동일하게 유지됩니다.

위생의 사용은 간단합니다. 예를 들어, 새 구성 요소를 작성하려면 다음과 같습니다.

 위생 편집기 구성 요소 New- 이름 NewExampleComponent

이 명령은 _templates/editor-component 디렉토리를 검색하고 해당 내용을 사용하여 필요한 파일을 생성합니다. 템플릿 디렉토리의 파일 이름은 중요하지 않습니다. 실제 출력 파일 이름 및 위치는 템플릿 파일의 프론트 물질 내에 정의됩니다. 이를 통해 동적 파일 이름 생성이 가능합니다.

템플릿 언어는 Rails Erb와 유사합니다. --name 매개 변수를 사용하면 템플릿에 값을 주입 할 수 있으며 도우미 기능은 케이스 변환 및 기타 조작 옵션을 제공합니다.

프로세스는 간단합니다. 명령을 실행하면 파일이 생성됩니다.

주요 테이크 아웃

• Hygen의 직관적 인 구문과 접근 방식은 또 다른 인기있는 옵션 인 Plop보다 나에게 더 매력적이었습니다.
• hygen delete 명령은 우발적이거나 잘못된 스캐 폴딩 후 청소를 단순화하는 데 유용한 추가 사항입니다.
• 사용 가능한 대 코드 확장은 프로세스를 추가로 간소화하여 명령 팔레트에서 직접 스캐 폴딩을 허용합니다.

위 내용은 Hygen으로 파일 스캐 폴딩의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!