Yeoman 생성기로 생성 된 파일에 템플릿 기반 콘텐트를 삽입하는 효율적이고 간단한 방법

Question

이미 생성기에서 생성 된 일부 파일이 있고 일부 내용의 템플릿을 기반으로 이러한 파일에 내용을 삽입하는 일부 하위 생성기를 만들려고한다고 가정합니다.

• applicatif 층
• 직업 층
• 비즈니스 대리인 층
:

목표 (타이프 작성된 Angular2 앱) 3 층으로 이루어지는 다층 구조의 발전기를 만들 수있다

각 생성기는 모듈 파일, 인터페이스 파일 등을 구성하는 모든 파일을 생성해야합니다.이 프로세스에서 생성 된 주요 3 개의 파일은 다음과 같습니다 이 E :

hero.applicatif.ts :

import { Injectable } from '@angular/core'; 
import { IHeroApplicatif } from './hero.applicatif.interface'; 
import { HeroMetier } from '../metier/hero.metier'; 
@Injectable() 
export class HeroApplicatif implements IHeroApplicatif { 
    constructor(private heroMetier: HeroMetier) {} 
} 

hero.metier.ts :

import { Injectable } from '@angular/core'; 
import { IHeroMetier } from './hero.metier.interface'; 
import { HeroBusinessDelegate } from '../business-delegate/hero.business-delegate'; 
@Injectable() 
export class HeroMetier implements IHeroMetier { 
    constructor(private heroBusinessDelegate: HeroBusinessDelegate) {} 
} 

hero.business-delegate.ts :

import { Injectable } from '@angular/core'; 
import { Http, Headers } from '@angular/http'; 
import { IHeroBusinessDelegate } from './hero.business-delegate.interface'; 
@Injectable() 
export class HeroBusinessDelegate implements IHeroBusinessDelegate { 
    constructor(private http: Http) {} 
} 

이러한 파일을 템플릿을 기반으로 생성해도 문제가 발생하지 않습니다. 하지만 사용자가 메서드 이름을 입력하라는 하위 생성자, 반환 형식 및 매개 변수가 필요하므로 하위 생성기는 이전에 생성 된 각 파일을 수정하여 각 레이어에 대한 코드를 삽입해야합니다. 다음 층.

hero.applicatif.ts :

import { Injectable } from '@angular/core'; 
import { IHeroApplicatif } from './hero.applicatif.interface'; 
import { HeroMetier } from '../metier/hero.metier'; 
@Injectable() 
export class HeroApplicatif implements IHeroApplicatif { 
    constructor(private heroMetier: HeroMetier) {} 
    getHero(id:number): Promise<any> { 
     return this.heroMetier.getHero(id); 
    } 
} 

을

는 서브 발생기 같이 수정 될 필요가 입력 getHero라는있어서, 상기 (3 개) 파일의 내용을 사용자에게 프롬프트를 가정

hero.metier.ts :

import { Injectable } from '@angular/core'; 
import { IHeroMetier } from './hero.metier.interface'; 
import { HeroBusinessDelegate } from '../business-delegate/hero.business-delegate'; 
@Injectable() 
export class HeroMetier implements IHeroMetier { 
    constructor(private heroBusinessDelegate: HeroBusinessDelegate) {} 
    getHero(id:number): Promise<any> { 
     return this.heroBusinessDelegate.getHero(id);   
    } 
} 

,

hero.business-delegate.ts :

import { Injectable } from '@angular/core'; 
import { Http, Headers } from '@angular/http'; 
import { IHeroBusinessDelegate } from './hero.business-delegate.interface'; 
@Injectable() 
export class HeroBusinessDelegate implements IHeroBusinessDelegate { 
    constructor(private http: Http) {} 
    getHero(id:number): Promise<any> { 
     return this.http.get(...).toPromise(); 
    } 
} 

그렇게하는 최신 방법까지 안전하고 간단한 무엇입니까?

Answer 1

코드 파일 콘텐츠를 최종 사용자가 예기치 않은 변경 사항을 버리지 않도록 안전하게 편집하려면 가장 안전한 방법은 파일 Abstract Syntax Tree을 수정하는 것입니다.

노드에는 여러 개의 AST 파서가 있습니다. 가장 인기있는 두 가지는 Esprima과 Acorn입니다.또한 AST를보다 쉽게 ​​수정하기위한 파서에 기반한 몇 가지 도구가 있습니다.

체크 아웃을 원할 경우 도구를 작성했습니다. https://github.com/SBoudrias/AST-query - 사용 사례에 따라 작동 할 수도 있습니다.