안녕하세요. 이미 다뤄진 내용이라면 죄송합니다 (찾지 못했거든요):
로컬 머신에서 Discourse 플러그인을 개발하는 과정은 꽤 느린 편입니다. 로컬에서 실행 중인 앱을 다시 로드하는 것(코드 변경 사항을 확인하기 위해)이 5초 이상 걸립니다. 그래서 html/hbs 또는 js 파일에서 변경 사항을 적용하고 저장한 뒤, 앱을 다시 로드해야 하고 [편집: 브라우저를 새로고침해야 하고], 변경 사항을 확인하려면 5초 이상을 기다려야 합니다.
로컬 Discourse 플러그인 개발 시 핫 리로드(즉, 로컬 뷰의 자동 업데이트)를 수행하는 방법이 있을까요?
CSS 파일은 자동으로 업데이트되는 것 같지만, html/hbs 또는 js 파일은 그렇지 않습니다.
힌트가 있는지 지켜보고 있긴 하지만, 그냥 그런 것 같다고 생각해요. 제가 본 바로는, Mac에서는 훨씬 더 심하더라고요.
여러분,
API가 변경된 경우, 즉 Ruby on Rails 코드가 수정된 경우에만 서버를 재시작하면 됩니다.
Javascript나 HBS 파일만 변경했다면, 브라우저만 새로고침하면 변경 사항을 적용할 수 있습니다.
CSS 파일 변경은 그마저도 필요하지 않다는 걸 이미 알아차렸을 겁니다! 
여기서 말하는 것은 브라우저 새로고침이며, 이를 피하기 위해 핫 리로드(hot reload)가 사용 가능한지에 대한 것입니다. 변경 사항을 확인하려면 브라우저 새로고침에 5초 이상 걸리기 때문입니다.
예를 들어 plugin.rb를 수정한 경우 서버를 중지하고 다시 시작해야 한다면, 아마도 60초 정도 걸릴 것입니다.
핫 리로드는 오늘날 많은 기술 개발에서 표준입니다(저는 이 표준을 갖춘 Angular에 가장 익숙합니다) 그리고 개발에 매우 유용합니다. Rails에서는 webpack을 통해 가능하다고 생각하지만(확실하지는 않습니다) discourse 개발에는 핫 리로드가 사용 가능하지 않을 것 같다는 인식이었습니다. 하지만 사용 가능하다면 정말 훌륭할 것 같아서 확인해 보고 싶었습니다.
업데이트된 JavaScript 파일을 적용하려면 브라우저를 새로고침해야 합니다.
이 기능은 EmberCLI: Coming to a Discourse near you! 를 통해 제공될 예정입니다.
사실 지금도 Ember CLI를 마스터 버전의 Discourse와 함께 사용해 이 동작을 구현할 수 있습니다!
정말 좋습니다, 감사합니다. 로컬 개발에 이걸 사용하려면, 제 컴퓨터에 GitHub에서 최신 버전의 Discourse를 다운로드하는 것 외에 다른 준비가 필요한가요?
최신 discourse를 체크아웃한 다음, 다음과 같은 작업을 수행해야 합니다:
API 서버 시작: rails s
Ember 서버 시작:
cd app/assets/javascript/discourseyarnember serve --proxy "http://localhost:3000"이후 http://localhost:4200을 열면 핫 리로딩이 포함된 Ember CLI 환경에서 실행 중임을 확인할 수 있습니다.
로컬 Discourse 인스턴스를 업그레이드하게 되어 기대감이 컸고, 현재 로컬에서 2.8 버전을 실행 중입니다. 하지만 HTML과 JS 변경 사항에 대한 핫 리로딩(hot reload)이 아직 작동하지 않습니다.
현재 실행 방법은 다음과 같습니다:
로컬의 discourse 폴더로 이동
$ redis-server //서버 시작
$ rails s //rails 앱 시작
$ yarn //첫 번째 실행 시에만 실행한다고 가정
$ bin/ember-cli //ember cli 시작. ember serve--proxy "http://localhost:3000" 명령어는 어떤 이유에서인지 오류가 발생했습니다
이렇게 하면 앱이 localhost:4200에서 성공적으로 실행됩니다.
로컬 Discourse 인스턴스에 플러그인을 추가했는데, localhost:4200에서 정상적으로 표시됩니다. 그러나 HTML이나 JS 파일을 수정하면, 브라우저 새로고침을 해야만 로컬에서 실행 중인 앱에 변경 사항이 반영됩니다.
핫 리로딩이 작동하도록 하기 위해 추가로 해야 할 일이 있나요?
안녕하세요. Discourse에서 ember-cli로 hot-reload을 사용할 수 있나요? 이전 게시물에서 언급했던 동일한 문제가 여전히 발생하고 있습니다. 해당 단계를 따랐음에도 불구하고 hot-reload이 작동하지 않습니다(즉, html과 javascript 변경 사항을 확인하려면 여전히 브라우저를 새로고침해야 하며, 파일 변경 후 저장 단축키를 눌러도 터미널에 ember-cli 출력이 표시되지 않음).
저는 핫 리로딩이 여전히 작동하지 않습니다. 이 단계 외에 추가로 해야 할 것이 있을까요?
나는 이렇게 합니다.
./bin/rails s
를 하나의 셸에서 실행하고
./bin/ember_cli
를 다른 셸에서 실행합니다.
네, 감사합니다. 저도 그렇게 하고 있어요. HTML과 JS 파일에 대해 자동 재로딩(auto reloading)이 되는가요?
hbs 파일을 말씀하시는 건가요?
네, 브라우저에서 'liveReload’라고 불리는 것으로 보이는 기능이 작동하지 않는 것 같습니다. 그런데도:
그리고 다음 스크립트가 존재하는데도 말이죠:
<script type="text/javascript" src="http://localhost:4200/_lr/livereload.js?port=4200&host=localhost&path=_lr/livereload"></script>
그리고
<script src="/ember-cli-live-reload.js" type="text/javascript"></script>
네, HBS 파일을 말씀드린 것입니다.
라이브 리로딩(특히 자바스크립트 파일에 대해)을 사용할 수 있으면 정말 좋겠습니다. 다른 환경에서 코딩할 때 라이브 리로딩은 표준 기능인데, 라이브 리로딩이 있으면 코딩 과정이 훨씬 빠르고 재미있어집니다.
추가 정보:
ember-cli/ember-cli-inject-live-reload: HTML 콘텐츠에 라이브 리로드 스크립트를 주입하는 Ember CLI 플러그인 (github.com)
“livereload.js는 Ember CLI로 돌아가는 웹소켓 연결을 시작합니다. 이를 통해 Ember CLI는 JavaScript나 스타일 변경 후 브라우저에 새로고침을 트리거하도록 알릴 수 있습니다.”
브라우저가 이를 무시하는 이유가 궁금합니다. 사이트 보안과 관련된 브라우저 옵션 때문일까요?
확실하지는 않지만, 다른 컨텍스트나 다른 프레임워크에서는 브라우저에서 라이브 리로드를 성공적으로 사용해 본 적이 있습니다. (Ember에 대해서는 잘 모르겠습니다 - 저는 항상 Discourse 코딩 관련 작업에서만 사용해 봤으니까요.)
라이브 리로드가 예상되는 기능인지 궁금합니다. 이전 토론을 보면 그렇습니다. 그렇다면 Discourse 팀은 라이브 리로드를 사용하고 있는지, 그리고 제가 놓치고 있는 것이 있는지 궁금합니다.
스크립트의 존재는 분명히 의도를 나타내는 신호일 것입니다. 여기서는 우연한 일이 없겠죠?
그래서 로컬 브라우저 설정 문제인지, 아니면 다른 설정 문제인지 궁금합니다.
livereload.js에 대해 더 알아보기: livereload/livereload-js: 서버와 통신하고 리로딩을 구현하는 LiveReload JavaScript 코드 (github.com)
클라이언트 측에서 CSS를 넘어 livereloading이 어느 정도까지 작동해야 하는지에 대해 공식적인 설명을 들을 수 있다면 좋겠습니다.
페이지가 자동으로 새로고침되는 기능은 Ember CLI에서 처리합니다. 현재 테마 및 플러그인 자산은 Ember CLI가 아니라 Rails 앱에서 컴파일되고 서빙됩니다. 따라서 테마/플러그인 변경 시 페이지가 자동으로 새로고침되지 않습니다.
이 부분은 향후 개선할 수 있는 사항입니다. 하지만 지금은 예상되는 동작입니다.