테스트 환경
- RPG Maker MV 버전 : RPG Maker MV 1.6.1 (2018.04.24)
nw.js의 경우, 다음 버전에서 테스트 했으나 똑같이 맞출 필요는 없습니다.
업데이트 하려면 SDK 버전을 받은 후, nwjs-win-test에 덮어씌우고 실행 파일 이름을 Game.exe로 변경하세요.
확장 프로그램 설치하기
크롬에서 확장 프로그램을 설치하세요.
PixiJS devtools - https://chrome.google.com/webstore/detail/pixijs-devtools/aamddddknhcagpehecnhphigffljadon
확장 프로그램의 id 값 찾기
확장 프로그램 세부 정보를 보면 확장 프로그램의 ID 값을 찾을 수 있습니다. 이 값을 복사합니다.
다음 경로에서 해당하는 ID 값으로 되어있는 폴더를 찾아서 들어갑니다. (찾기 기능 이용)
주소를 텍스트로 복사합니다.
복사된 주소를 메모장에 붙여넣고 바꾸기 기능을 이용하여 경로 구분자 \을 /으로 변경합니다.
위와 같이 드라이브 뒤에는 /을 두 개 붙여야 합니다.
package.json 파일 수정하기
게임 루트 폴더에서 패키지 설정 파일을 찾아서 열고 다음과 같이 작성합니다.
콜론(:)을 기준으로 앞에 있는 문자는 키, 뒤에 있는 문자는 값으로 표현하는 JSON 규격의 파일입니다.
chromium-args이라는 키 값을 새로 추가하고, 여기에 --load-extension='(여기에 확장 프로그램의 주소를 적으세요)' 라는 명령행 인자를 추가합니다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | { "name": "", "main": "index.html", "js-flags": "--expose-gc", "chromium-args": "--enable-logging=stderr --load-extension='C://Users/U/AppData/Local/Google/Chrome/User Data/Default/Extensions/aamddddknhcagpehecnhphigffljadon/0.8.1_0' --d3d11 --ignore-gpu-blacklist --fast-start", "window": { "title": "", "toolbar": false, "width": 816, "height": 624, "icon": "icon/icon.png" } } | cs |
예를 들면 위와 같습니다. 참고로 주소 값이 절대 주소라 테스트 게임에서만 사용이 가능합니다. 배포 이후에도 사용하려면 확장 파일을 같이 포함해야 합니다. 그리고 상대 주소로 변경해야 합니다. 상대 주소는 실행 파일(.exe)이 있는 경로에 Extensions 폴더를 하나 만들고, 그 안에 확장 파일들을 넣으면 됩니다. 상대 주소를 만든다면 주소는 다음과 같을 것입니다.
--load-extension='./Extensions/aamddddknhcagpehecnhphigffljadon/0.8.1_0'
제 설정 파일은 다음과 같습니다.
설정 파일을 저장하고 게임을 실행하고 개발자 도구를 열면 Pixi라는 새로운 탭이 추가됩니다.
왼쪽 패널에는 트리 구조로 스프라이트 객체들이 최상위 부모를 기준으로 나열되어있고, 오른쪽에는 트랜스폼 같은 속성을 수정할 수 있게 되어있습니다.
왼쪽 패널에서 스프라이트 객체들을 선택하면 위와 같이 파란색 상자로 강조됩니다.
※ 참고 : Pixi v3 버전을 기준으로 제작된 확장 프로그램이라 선택 시 가끔 오류가 날 수 있습니다.
확장 프로그램을 추가하는 것은 간단했지만, 모든 확장 프로그램을 이용할 수는 없습니다.
확장 프로그램들 중에는 주소 표시줄 오른쪽에 확장 버튼으로 관련 패널을 활성화해야 하는 경우가 있는데,
NWJS에서는 확장 프로그램이 표시되는 패널이 없기 때문입니다.
패널 버튼에 표시되는 확장 프로그램을 쓰려면 확장 프로그램의 소스를 이용하여 따로 수정을 해야 할 것입니다.
확장 프로그램 비활성화 하기
참고로, 확장 프로그램을 비활성화 하고 싶을 경우,
개발자 도구의 콘솔에서 location.href = "chrome://extensions/"; 를 입력하고 들어가서 따로 비활성화 해야 합니다.
이 내용에 대한 스크린샷은 아래와 같습니다.
