# Install the Discourse Theme CLI console app to help you build themes

**URL:** https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950
**Category:** Developer Guides
**Tags:** how-to, theme-guides
**Created:** [3월 14, 2018, 5:24오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950 "2018-03-14T05:24:33Z")
**Posts on this page:** 18
**Page:** 1

<div class="post-metadata">

### Author: ![Discourse](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/discourse/32/148734_2.png) [@Discourse](https://meta.discourse.org/u/Discourse)
#### Post date: [3월 14, 2018, 5:24오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/1 "2018-03-14T05:24:34Z")

</div>

The [![discourse](https://global.discourse-cdn.com/meta/original/4X/2/1/3/21366b58dab3ee1ef263a8e74c09dd323ee348de.png) Discourse Theme CLI](https://github.com/discourse/discourse_theme) is a ruby gem that allows you to use your editor of choice when developing Discourse themes and theme components. As you save files the CLI will update the remote theme or component and changes to it will appear live!

## Installing

To play with it, make sure you have **Ruby 2.5** or up installed.

 ![image](https://global.discourse-cdn.com/meta/original/4X/5/d/0/5d0aaed7923ecdd7d6a652e39a0e27507ea08e1b.png)

If you are on Windows, you have 2 options:

**Option 1** : [Windows Subsystem for Linux](https://en.wikipedia.org/wiki/Windows_Subsystem_for_Linux).

Windows 10 has access to a full Linux environment, you can use it to install ruby simply with `sudo apt-get install ruby`, this will give you Ruby 2.3.

**Options 2** : Older Windows

Older versions of Windows have no access to WSL, you can easily install Ruby with [Ruby Installer](https://rubyinstaller.org/), go for the recommended version and default settings for the install.

 ![image](https://global.discourse-cdn.com/meta/original/4X/e/6/c/e6c0533a52c6b2d73fa55f966008af9815b7b635.png)

Mac OS version 10.13.3 ship with Ruby 2.3 out of the box, nothing special is needed. If you are running an earlier version of Mac OS consider using [rvm](https://rvm.io/rvm/install), [rbenv](https://github.com/rbenv/rbenv) or [homebrew](https://brew.sh/) to install a recent ruby.

* * *

Once Ruby 2.2 or later is running, open a terminal or command shell and run:

```sh
gem install discourse_theme

```

Once installed, to learn more about it:

```sh
discourse_theme

```

## Upgrading

```sh
gem update discourse_theme

```

## Features

The CLI provides 3 main functions:

### discourse\_theme new

You can use it to quickly create a new theme with `discourse_theme new YOUR_DIR_NAME`

### discourse\_theme watch

You can use it to monitor a theme and **synchronize** with a discourse site (with live refresh) using `discourse_theme watch YOUR_DIR_NAME`

What this means is that you can use **your own editor** to edit you theme and site will magically :unicorn: update with the changes!

### discourse\_theme download

You can download an existing theme from Discourse using `discourse_theme download YOUR_DIR_NAME`. You will then be given the option to start “watching” straight away!

## Credentials

You will need to generate an API Key. Go to the admin area and generate a key there.

- ❗ Select a “User Level” of `Single User` when generating the key, not `All Users`.
- ❗ Make sure to check `Global Key` or you will receive 403 forbidden errors.

Credentials are (optionally) stored at `~/.discourse_theme`. API keys are stored per-site, and the URL/theme\_id for each directory is also tracked. If you ever need to change your settings, just add `--reset` to any command and you will be prompted for all values again.

## Testimonials

“This tool is truly a GEM!” @awole20  
“This is very very good.” @awesomerobot  
“It’s working 🙂 And it’s pretty dosh garn cool. Nice!” @angus  
“OMG. It’s unbelievable.” @pfaffman

* * *

This document is version controlled - suggest changes [on github](https://github.com/discourse/discourse/blob/main/docs/developer-guides/docs/05-themes-components/05-theme-cli.md).

---

<div class="post-metadata">

### Author: ![riladant](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/riladant/32/343149_2.png) [@riladant](https://meta.discourse.org/u/riladant)
#### Post date: [12월 5, 2023, 3:30오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/191 "2023-12-05T03:30:52Z")

</div>

관리자 \> 사용자 지정 \> 테마를 통해 `업로드`한 파일은 테마를 저장한 후에 사라집니다.

테마에 이미지 자산을 포함시켜 저장 후에도 지워지지 않도록 하는 방법은 무엇인가요?

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [12월 5, 2023, 4:37오후 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/192 "2023-12-05T16:37:50Z")

</div>

안녕하세요, 오신 것을 환영합니다!

테마 컴포넌트에 에셋을 직접 포함시켜야 합니다.

루트 디렉터리에 `assets` 폴더를 생성하세요.  
그 다음 `about.json` 파일에서 에셋을 선언합니다.

```plaintext
"assets": {
  "<your_identifier>": "assets/<your_asset_filename>",
}

```

예제는 [https://github.com/MeghnaAJ/discourse-christmas-decorations에서](https://github.com/MeghnaAJ/discourse-christmas-decorations%EC%97%90%EC%84%9C) 확인할 수 있습니다.

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [3월 11, 2024, 6:31오후 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/193 "2024-03-11T18:31:07Z")

</div>

이 도구를 사용하여 테마 컴포넌트를 생성하는 개발자분들을 위한 간단한 안내입니다:  
업그레이드를 권장합니다! 👍

최근 [PR](https://github.com/discourse/discourse_theme/pull/44)을 통해 [discourse-theme-skeleton](https://github.com/discourse/discourse-theme-skeleton) 저장소가 기본 템플릿으로 설정되었습니다. 최신 설정 파일을 제공받을 수 있습니다!

---

<div class="post-metadata">

### Author: ![carbonrich](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/carbonrich/32/274219_2.png) [@carbonrich](https://meta.discourse.org/u/carbonrich)
#### Post date: [3월 12, 2024, 12:55오후 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/194 "2024-03-12T12:55:23Z")

</div>

감사합니다!

이 주제에 업데이트 섹션을 추가하면 좋겠습니다…

–reset인가요, 아니면 rubygem update인가요?

---

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [3월 12, 2024, 12:57오후 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/195 "2024-03-12T12:57:25Z")

</div>

좋은 아이디어! OP에 ‘업그레이드’ 섹션을 추가했습니다

```plaintext
gem update discourse_theme

```

---

<div class="post-metadata">

### Author: ![Heinenen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/heinenen/32/372537_2.png) [@Heinenen](https://meta.discourse.org/u/Heinenen)
#### Post date: [3월 25, 2024, 11:33오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/196 "2024-03-25T11:33:11Z")

</div>

WSL에 gem을 설치하려면 `sudo apt-get install ruby`와 `sudo apt-get install ruby-dev`를 모두 실행해야 했습니다.  
설치 지침에 이 내용을 추가할 수 있을 것 같습니다.

---

<div class="post-metadata">

### Author: ![tgxworld](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tgxworld/32/106117_2.png) [@tgxworld](https://meta.discourse.org/u/tgxworld)
#### Post date: [3월 26, 2024, 1:23오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/197 "2024-03-26T01:23:29Z")

</div>

> [@sam](#):
>
> Windows 10은 완전한 Linux 환경에 접근할 수 있으며, `sudo apt-get install ruby` 명령을 사용하여 ruby를 쉽게 설치할 수 있습니다. 이렇게 하면 Ruby 2.3가 설치됩니다.

`ruby-dev`를 설치하지 않으면 오류가 발생합니까? `ruby` 자체만으로도 충분하므로 `ruby-dev`를 설치할 필요는 없습니다.

---

<div class="post-metadata">

### Author: ![Heinenen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/heinenen/32/372537_2.png) [@Heinenen](https://meta.discourse.org/u/Heinenen)
#### Post date: [3월 26, 2024, 10:46오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/198 "2024-03-26T10:46:28Z")

</div>

`ruby-dev`를 설치하라고 알려주는 오류가 떴던 것 같은데, 만약 그런 오류가 없었으면 해당 패키지가 존재하는지 알 수 없었을 거예요.  
다시 재설치를 시도해 보았지만 오류를 재현할 수 없어요. 처음에 뭔가 이상한 짓을 한 건 아닌지 모르겠네요.

---

<div class="post-metadata">

### Author: ![tgxworld](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tgxworld/32/106117_2.png) [@tgxworld](https://meta.discourse.org/u/tgxworld)
#### Post date: [3월 26, 2024, 11:48오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/199 "2024-03-26T11:48:42Z")

</div>

음, 정말 이상하네요. 문제가 다시 재현되면 알려 주세요.

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [8월 13, 2025, 9:56오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/201 "2025-08-13T09:56:51Z")

</div>

어제 서버를 3.5.0.beta9-dev로 업데이트했는데, 그 이후로 discourse theme gem으로 라이브 리로딩이 되지 않습니다. Gem 버전은 2.1.6입니다.

오류 같은 것은 보이지 않아서, 혹시 다른 분들도 같은 문제를 겪고 있는지 먼저 여쭤봅니다.

---

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [8월 18, 2025, 5:32오후 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/202 "2025-08-18T17:32:19Z")

</div>

스타일시트의 라이브 리로드는 테마 및/또는 Discourse 코어 업데이트 시 문제를 일으키고 있었기 때문에 [프로덕션 인스턴스에 대해 비활성화되었습니다](https://github.com/discourse/discourse/commit/351d3d4eb94390ef667b72e3d4ba9c740224c44c).

근본적인 이유는 스타일시트 변경이 종종 JS/HTML 변경과 연결되어 있기 때문에, 스타일시트만 라이브 로딩하는 것은 위험할 수 있습니다. 사용자는 ‘새로운’ 스타일시트를 ‘오래된’ HTML과 함께 실행하게 되며, 이로 인해 매우 이상한 경험이 발생할 수 있습니다.

라이브 로딩은 개발 모드 Discourse 인스턴스에 대해서는 여전히 활성화되어 있습니다. 이상적으로는 프로덕션 사이트 대신 개발을 위해 이를 사용해야 합니다. 스타일시트 리로드 외에도, 개발 모드 Ember는 프로덕션 모드 Ember보다 훨씬 더 친근한 에러 메시지를 제공합니다.

---

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [8월 19, 2025, 12:03오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/203 "2025-08-19T00:03:30Z")

</div>

> [@david](#):
>
> 스타일시트의 라이브 리로드는 테마 및/또는 Discourse 코어 업데이트 시 문제를 일으키고 있어, [프로덕션 인스턴스에 대해서는 비활성화되었습니다](https://github.com/discourse/discourse/commit/351d3d4eb94390ef667b72e3d4ba9c740224c).

꽤 큰 변경사항이네요. 공지사항이 없었다는 점이 놀랍습니다. 저는 주로 프로덕션 사이트에서만 테마 개발을 해왔거든요.

이전 동작 방식을 복원할 수 있는 사이트 설정 항목이 있으면 좋겠습니다.

---

<div class="post-metadata">

### Author: ![rahim123](https://avatars.discourse-cdn.com/v4/letter/r/df705f/32.png) [@rahim123](https://meta.discourse.org/u/rahim123)
#### Post date: [8월 23, 2025, 5:22오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/204 "2025-08-23T05:22:50Z")

</div>

동의합니다. 저도 놀랐고, 검색을 해봐도 이 현재 스레드를 찾을 수 없었습니다. 아니면 이전 OP 날짜를 보고 무시한 걸 수도 있겠네요.

> [@CSS 수정 시 라이브 리로드가 더 이상 작동하지 않나요?](https://meta.discourse.org/t/no-more-live-reload-with-css-modifications/379977):
>
> Hi there, I just upgraded to 3.5.0. In previous versions it would immediately apply CSS modifications in theme components without reloading the page. This doesn’t seem to be working anymore. Is it broken, or is it disabled? Thanks a lot!

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2월 4, 2026, 11:20오후 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/205 "2026-02-04T23:20:56Z")

</div>

게시물이 새 주제로 분리되었습니다: [이전 테마를 복구하는 방법](https://meta.discourse.org/t/how-do-i-recover-a-previous-theme/395226)

---

<div class="post-metadata">

### Author: ![sk-or-v1-contents](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sk-or-v1-contents/32/547175_2.png) [@sk-or-v1-contents](https://meta.discourse.org/u/sk-or-v1-contents)
#### Post date: [7월 30, 2026, 8:27오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/206 "2026-07-30T08:27:21Z")

</div>

설정에서 앱(Apps) 섹션의 스크린샷을 올려주실 수 있나요? 찾을 수가 없어요.

 ![Screenshot](https://global.discourse-cdn.com/meta/original/4X/1/5/7/1572ad873781af8ae0175222476c565870c48445.jpeg)

> 이 키에 대한 액세스를 취소하려면 사용자 설정의 ‘앱(Apps)’ 섹션을 방문하세요.

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [7월 30, 2026, 8:41오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/207 "2026-07-30T08:41:23Z")

</div>

설정(Prefs) 하단의 보안(Security) 항목에 있습니다.

해당 문구를 다음과 같이 개선할 수 있습니다:

> 이 키에 대한 액세스를 취소하려면 사용자 설정의 ‘앱’ 아래 ‘보안’ 섹션을 방문하세요.

---

<div class="post-metadata">

### Author: ![sk-or-v1-contents](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sk-or-v1-contents/32/547175_2.png) [@sk-or-v1-contents](https://meta.discourse.org/u/sk-or-v1-contents)
#### Post date: [7월 30, 2026, 8:47오전 UTC](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950/208 "2026-07-30T08:47:18Z")

</div>

이제 보입니다. 새로고침을 해야 표시되는 것 같네요.