path: root/files/ko/mozilla/add-ons/setting_up_extension_development_environment/index.html

---
title: 확장기능 개발 환경 구축
slug: Mozilla/Add-ons/Setting_up_extension_development_environment
translation_of: Archive/Add-ons/Setting_up_extension_development_environment
---
<p>이 글에는 확장기능 개발을 위한 Mozilla 응용프로그램 설정 방법을 제공합니다. 특별한 지정하지 않는 한 이 방법들은 Firefox와 Thunderbird 뿐만 아니라 SeaMonkey 버전 2.0 이상에서도 적용가능합니다.</p>
<h3 id="개요">개요</h3>
<ul>
 <li>Firefox의 개발세션을 실행하기 위한 개발용 <strong>사용자 프로필</strong>을 생성합니다. 그리고 <code>about:config</code> 에서 특정한 개발용 환경설정을 합니다.</li>
 <li>개발용 프로필에 몇가지 Firefox <strong>개발용 확장기능</strong>을 설치합니다.</li>
 <li>당신의 프로필의 extensions 폴더안의 파일들을 수정하고 개발용 프로필과 응용프로그램을 재시작합니다.</li>
</ul>
<h3 id="Development_profile" name="Development_profile">개발용 프로필</h3>
<p>개발 단계에서 성능저하를 방지하려면 환경 설정 및 확장과 관련된 개인 데이터의 손실을 피하기 위해 개발 작업을 위한 별도의 프로필을 사용 할 수 있습니다.</p>
<p>별도의 프로필과 <code>-no-remote</code> 매개 변수와 함께 응용 프로그램을 구동하여 같은 시간에 Thunderbird 또는 Firefox 의 두 개의 인스턴스를 실행 할 수 있습니다.</p>
<p>우분투:</p>
<pre>/usr/bin/firefox -no-remote -P dev</pre>
<p>다른 리눅스 배포판:</p>
<pre>/usr/local/bin/firefox -no-remote -P dev
</pre>
<p>맥킨토시:</p>
<pre class="eval">/Applications/Firefox.app/Contents/MacOS/firefox-bin -no-remote -P dev &amp;
</pre>
<p>윈도우즈:</p>
<pre class="eval">시작 -&gt; 실행 "%ProgramFiles%\Mozilla Firefox\firefox.exe" -no-remote -P dev
</pre>
<p>Firefox 대신에 Thunderbird 또는 SeaMonkey를 시작 하려면 , 위의 예제에서 "firefox" 대신 "thunderbird" 또는 "seamonkey" 으로 대체합니다.</p>
<p>프로필 지정이 존재 하지 않는 경우 (또는 프로필을 지정 안하는 경우), Thunderbird 또는 Firefox 프로필 관리자가 표시됩니다. 기본 프로필로 실행 하기위해 프로필을 "default"로 지정합니다. (또는 "-P 를 생략합니다.).</p>
<p>(There is a thread in the <a class="external" href="http://forums.mozillazine.org/" title="http://forums.mozillazine.org/">Mozillazine forums</a> that explains how to use both stable and development versions of Firefox to check extension compatibility. See <a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=613873">Installing Firefox 3 or Minefield while keeping Firefox 2</a>.)</p>
<h3 id="Development_preferences" name="Development_preferences">개발용 설정</h3>
<p>There is a set of development preferences that, when enabled, allows you to view more information about application activity, thus making debugging easier. However,  these preferences can degrade performance, so you may want to use a separate development profile when you enable these preferences. For more information about Mozilla preferences, refer to the mozillaZine article on "<a class="external" href="http://kb.mozillazine.org/About:config" title="http://kb.mozillazine.org/About:config">about:config</a>".</p>
<p>Not all preferences are defined by default, and are therefore not listed in <code>about:config</code> by default. You will have to create new (boolean) entries for them.</p>
<ul>
 <li><strong>javascript.options.showInConsole</strong> = <strong>true</strong>. Logs errors in chrome files to the <a href="/en/Error_Console" title="en/Error_Console">Error Console</a>.</li>
 <li><strong>nglayout.debug.disable_xul_cache</strong> = <strong>true</strong>. Disables the XUL cache so that changes to windows and dialogs do not require a restart. This assumes you're <a href="#Using_directories_rather_than_JARs">using directories rather than JARs</a>. Changes to XUL overlays will still require reloading of the document overlaid.</li>
 <li><strong>browser.dom.window.dump.enabled</strong> = <strong>true</strong>. Enables the use of the <span style="font-family: Courier New;">dump()</span> statement to print to the standard console. See <span style="font-family: Courier New;">{{ Domxref("window.dump") }}</span> for more info. You can also use <span style="font-family: Courier New;">{{ Interface("nsIConsoleService") }}</span> from a privileged script.</li>
 <li><strong>javascript.options.strict</strong> = <strong>true</strong>. Enables strict JavaScript warnings in the Error Console. Note that since many people have this setting turned off when developing, you will see lots of warnings for problems with their code in addition to warnings for your own extension. You can filter those with <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/1815">Console<sup>2</sup></a>.</li>
 <li><strong>extensions.logging.enabled</strong> = <strong>true</strong>. This will send more detailed information about installation and update problems to the <a href="/en/Error_Console" title="en/Error Console">Error Console</a>. (Note that the extension manager automatically restarts the application at startup sometimes, which may mean you won't have time to see the messages logged before the automatic restart happens. To see them, prevent the automatic restart by setting the environment NO_EM_RESTART to 1 before starting the application.)</li>
 <li>You might also want to set <strong>dom.report_all_js_exceptions = true</strong>. See <a class="internal" href="/en/Exception_logging_in_JavaScript" title="en/Exception logging in JavaScript">Exception logging in JavaScript</a> for details.</li>
</ul>
<h4 id="Accessing_Firefox_development_preferences">Accessing Firefox development preferences</h4>
<p>To change preference settings in Firefox or SeaMonkey, type <code>about:config </code>in the Location Bar. Alternatively, use the <a class="external" href="http://addons.mozilla.org/en-US/firefox/addon/7434/" title="http://addons.mozilla.org/en-US/firefox/addon/7434/">Extension Developer's Extension</a>, which provides a menu interface for Firefox settings.</p>
<h4 id="Accessing_Thunderbird_development_preferences">Accessing Thunderbird development preferences</h4>
<p>To change preference settings in Thunderbird, open the "Preferences" (Unix) or "Options" (Windows) interface. On the "Advanced" page, select the "General" tab then click the "Config Editor" button.</p>
<h3 id="Development_extensions" name="Development_extensions">개발에 도움되는 확장 기능</h3>
<p>이 확장 기능들이 당신이 개발을 할때 도움을 줄 수 있습니다.</p>
<ul>
 <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/6622" title="https://addons.mozilla.org/en-US/firefox/addon/6622">DOM Inspector</a>,  웹 문서 또는 XUL 응용 프로그램의 live DOM을 점검하고 편집하는 곳에 사용 (Firefox 와 Thunderbird)</li>
 <li><a class="external" href="http://www.hacksrus.com/~ginda/venkman/" title="http://www.hacksrus.com/~ginda/venkman/">Venkman</a>, JavaScript 디버거 (<a class="external" href="http://addons.mozilla.org/en-US/firefox/addon/216" title="http://addons.mozilla.org/en-US/firefox/addon/216">Firefox 버전</a>, <a class="external" href="http://addons.mozilla.org/en-US/thunderbird/addon/216" title="http://addons.mozilla.org/en-US/thunderbird/addon/216">Thunderbird 버전</a>)</li>
 <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/7434/">Extension Developer's Extension</a> 확장 기능 개발을 위한 툴 제품군 (Firefox)</li>
 <li><a class="external" href="http://console2.mozdev.org/" title="http://console2.mozdev.org/">Console<sup>2</sup></a> 향상된 JavaScript 콘솔 (<a class="external" href="http://addons.mozilla.org/en-US/firefox/addon/1815" title="http://addons.mozilla.org/en-US/firefox/addon/1815">Firefox 버전</a>, <a class="external" href="http://addons.mozilla.org/en-US/thunderbird/addon/1815" title="http://addons.mozilla.org/en-US/thunderbird/addon/1815">Thunderbird 버전</a>)</li>
 <li><a class="link-https" href="https://addons.mozilla.org/firefox/addon/5058" title="https://addons.mozilla.org/firefox/addon/5058">Javascript Command</a> Firefox windows 에서 javascript를 작성 및 테스트 하는 곳에 사용</li>
 <li><a class="external" href="http://www.gijsk.com/" title="http://www.gijsk.com/">Chrome List</a> chrome:// 안에서 파일을 탐색하고 보는 곳에 사용 (<a class="external" href="http://addons.mozilla.org/en-US/firefox/addon/4453" title="http://addons.mozilla.org/en-US/firefox/addon/4453">Firefox 버전</a>, <a class="external" href="http://addons.mozilla.org/en-US/thunderbird/addon/4453" title="http://addons.mozilla.org/en-US/thunderbird/addon/4453">Thunderbird 버전</a>)</li>
 <li><a class="external" href="http://webdesigns.ms11.net/chromeditp.html" title="http://webdesigns.ms11.net/chromeditp.html">Chrome Edit Plus </a> 사용자 파일 에디터 (Firefox 와 Thunderbird)</li>
 <li><a class="external" href="http://ted.mielczarek.org/code/mozilla/extensionwiz/" title="http://ted.mielczarek.org/code/mozilla/extensionwiz/">Extension Wizard</a> 확장 기능의 골격을 생성하는 <span class="short_text" id="result_box"><span style="background-color: rgb(255, 255, 255);" title="a web-based application that generates an
    extension skeleton">웹 기반 응용 프로그램 </span></span>(Firefox 와 Thunderbird)</li>
 <li><a class="link-https" href="https://addons.mozilla.org/firefox/addon/1843">Firebug</a> 다양한 개발 도구 (Firefox)</li>
 <li><a class="external" href="http://getfirebug.com/releases" title="http://getfirebug.com/releases">Chromebug</a> JavaScript 디버거와 DOM의 결합 요소 (Firefox, "kinda works for Thunderbird")</li>
 <li><a class="external" href="http://hyperstruct.net/projects/mozrepl" title="http://hyperstruct.net/projects/mozrepl">MozRepl  </a>Firefox 와 다른 Mozilla 응용 프로그램이 실행 되는 동안 탐색 과 편집 (Firefox 와 Thunderbird)</li>
 <li><a class="external" href="http://www.mouseless.de/index.php?/content/view/18/31/" title="http://www.mouseless.de/index.php?/content/view/18/31/">ExecuteJS</a> 향상된 JavaScript 콘솔 (<a class="link-https" href="https://addons.mozilla.org/firefox/addon/1729" title="https://addons.mozilla.org/firefox/addon/1729">Firefox 버전</a>, <a class="external" href="http://xsidebar.mozdev.org/modifiedmisc.html#executejs" title="http://xsidebar.mozdev.org/modifiedmisc.html#executejs">Thunderbird 버전</a>)</li>
 <li><a class="external" href="http://xpcomviewer.mozdev.org">XPCOMViewer</a> XPCOM 검사기 (Firefox 와 Thunderbird)</li>
 <li><a class="internal" href="/en/JavaScript_shells" title="En/JavaScript
    shells">JavaScript shells</a> JavaScript 의 미리보기 테스트  (Firefox 와 Thunderbird)</li>
 <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/5817" title="https://addons.mozilla.org/en-US/firefox/addon/5817">SQLite Manager</a> SQLite 데이터베이스를 관리 (Firefox 와 Thunderbird)</li>
 <li><a class="external" href="http://www.rumblingedge.com/viewabout/" title="http://www.rumblingedge.com/viewabout/">ViewAbout</a> enables access to various about: dialogs from the View menu (<a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/9695" title="https://addons.mozilla.org/en-US/firefox/addon/9695">Firefox 버전</a>, <a class="link-https" href="https://addons.mozilla.org/en-US/thunderbird/addon/9695" title="https://addons.mozilla.org/en-US/thunderbird/addon/9695">Thunderbird 버전</a>)</li>
 <li><span class="content"><span class="title"><a class="external" href="http://code.google.com/p/crashme/" title="http://code.google.com/p/crashme/">Crash Me Now!</a> </span></span><span class="short_text" id="result_box"><span style="background-color: rgb(255, 255, 255);" title="useful for testing
    debug symbols and the
    crash reporting system">디버그 기호 및 충돌 보고 시스템</span></span> (Firefox 와 Thunderbird)</li>
</ul>
<p> </p>
<h3 id="Custom_code_location" name="Custom_code_location">Firefox extension proxy file</h3>
<p>Extension files are normally installed in the user profile. However, it is usually easier to place extension files in a temporary location, which also  protects source files from accidental deletion. This section explains how to create a proxy file that points to an extension that is installed in a location other than the user profile.</p>
<ol>
 <li>Get the extension ID from the extension's install.rdf file.</li>
 <li>Create a file in the "extensions" directory under your profile directory with the extension's ID as the file name (for example "your_profile_directory/extensions/{46D1B3C0-DB7A-4b1a-863A-6EE6F77ECB58}"). (<a class="external" href="http://kb.mozillazine.org/Profile_folder">How to find your profile directory</a>) Alternatively, rather than using a GUID, create a unique ID using the format "name@youremail" (for example <span style="font-family: Courier New;"><a class="link-mailto" href="mailto:chromebug@mydomain.com" rel="freelink">chromebug@mydomain.com</a>).</span></li>
 <li>The contents of this file should be the path to the directory that contains your install.rdf file. (eg. "<span style="font-family: Courier New;">/full/path/to/yourExtension/</span>". Windows users should use the drive name (CAPS) and backslashes instead of frontslashes (for example "<span style="font-family: Courier New;">C:\full\path\to\yourExtension\</span>" or "<span style="font-family: Courier New;">C:\sam\workspace\toolbar\helloWorldtoolbar\</span>").Remember to include the closing slash and remove any trailing whitespace.
  <ul>
   <li>In Firefox 3, if you already installed the extension via XPI, you might need to install one or all of the extensions.* files in the profile folder. Backup first, but these files will be regenerated. (I don't know what the original author had in mind here, but the files <span style="font-family: Courier New;">extensions.cache, extensions.ini, extensions.rdf, compreg.dat, <span style="font-family: Verdana;">and</span> xpti.dat</span> are all regenerated by Firefox if deleted. You need to delete them if you mess with 'components', no harm done. Firefox will disconnect from its parent process when it regens these files, so you may have to exit once and restart if you use the OS console.)</li>
  </ul>
 </li>
 <li>Place the file in the extensions folder of your profile and restart the application.</li>
</ol>
<h3 id="Using_directories_rather_than_JARs" name="Using_directories_rather_than_JARs">Using directories rather than JARs</h3>
<p>Regardless of whether you choose to eventually package your extension's chrome in a JAR or in directories, developing in directories is simpler. If you choose a JARed structure for releasing, you can still develop with a directory structure by editing your chrome.manifest. For example, rather than having</p>
<pre class="eval">content	myExtension	jar:chrome/myExtension.jar!/content/
</pre>
<p>use</p>
<pre class="eval">content	myExtension	chrome/content/
</pre>