18/03/15 · Log.dev() Ghost

Ghost 블로그 테마 개발 환경 세팅

Ghost 블로그 테마 개발 환경 세팅

작업환경

  • macOS High Sierra 10.13.3
  • nodejs 8.10.0
  • python 2.7.10
  • based ghost theme : Casper

1. Ghost 설치

$ npm i -g ghost-cli@latest
$ mkdir [local-ghost-path]
$ cd [local-ghost-path] 
$ ghost install local

2. 테마 설치

Casper 테마 clone

$ cd [local-ghost-path]/content/themes
$ git clone https://github.com/TryGhost/Casper.git [my-theme-name]

테마 기본 속성 수정

[local-ghost-path]/content/themes/[my-theme-name]/package.json 파일을 열어 기본 정보들을 수정한다.
각 속성들의 규칙은 https://themes.ghost.org/docs/packagejson 에서 확인.

테마 빌드

// casper 테마는 Gulp/PostCSS를 사용하여 빌드하게때문에 gulp를 설치한다.
$ npm install --save gulp-install

$ cd [local-ghost-path]/content/themes/[my-theme-name]
$ gulp

3. ghost 실행

$ cd [local-ghost-path]

// ghost가 실행중인지 확인
$ ghost ls
// if ghost가 이미 실행되고 다면
$ ghost stop

$ npm install -g nodemon@latest

$ nodemon current/index.js --watch content/themes/[my-theme-name] --ext hbs,js,css

ghost 실행 후 localhost:2368/ghost로 접속하여 빌드한 테마를 적용한다.

4. Production에 적용

$ cd [local-ghost-path]/content/themes/[my-theme-name]
$ gulp zip

[local-ghost-path]/content/themes/[my-theme-name]/dist에 테마 파일이 .zip포멧으로 생성되고 그 파일을 production에 적용한다.

  • LinkedIn
  • Tumblr
  • Reddit
  • Google+
  • Pinterest
  • Pocket
Comments powered by Disqus