빌드와 배포 분리

빌드와 배포 분리

우리가 티스토리 스킨을 만들때 자신이 사용할 스킨으로 빌드 tidory build 하는 경우와 배포전용 버전 tidory dist 할 때 포함하고 싶은 리소스나 클래스가 서로 다를 수 있습니다. 물론 git branch 로도 커버할 수 있지만, 조건부 해석 을 사용하면 간단하게 할 수 있습니다.

조건부 해석

분리를 위해 사용해볼 기능은 퍼그에서 제공하는 조건부 해석 입니다. 어떻게 사용하면 좋을지 알아봅시다.
예를 들어 head 태그에 배포용이 아닌, 자신만 사용할 리소스를 포함한다고 가정하여 봅시다.
index.pug

//- End of head
block HEAD
  link(rel="stylesheet" href="./images/prism.css")
여기서 조건부 해석 기능과 전역변수 사용을 함께하면 구분할 수 있습니다. 우선 전역변수 를 설정합니다.
tidory.config.js

const tidory = require('tidory');
const globalVariable = tidory.GlobalVariable;

globalVariable.register(function(done) {
  done('BUILD_ONLY', true);
});
그런 다음, if 구문으로 빌드시에만 적용할 태그에 적용합니다. 이렇게 하고 빌드한 다음, 배포 할 때에는 BUILD_ONLY 전역변수의 값을 false 로 변경합니다.
index.pug

//- End of head
block HEAD
  if TIDORY.BUILD_ONLY
    link(rel="stylesheet" href="./images/prism.css")
클래스 바인딩 기능으로 포함 클래스를 지정할 수도 있겠죠?
*.pug

//- template
div(class="tidory" class={"build": TIDORY.BUILD_ONLY})