웹킷(WebKit)은 웹 브라우저를 만드는 데 기반을 제공하는 오픈 소스 응용 프로그램 프레임워크이다. 원래는 Mac OS X의 사파리 웹 브라우저 엔진으로 사용하기 위해 컨커러 브라우저의 KHTML 소프트웨어 라이브러리에서 가져온 것이었으나 지금은 옴니웹, 시이라, 아로라, 미도리, 유즈블, iCab, 어도비 통합 런타임, 휴대 전화(아이폰 포함), 노키아의 Series 60 브라우저, 구글의 안드로이드 플랫폼에 사용되고 있다.
아래 URL 로 이동하면 WebKit 에 대해 자세한 정보를 얻을 수 있다.
웹에 대한 재조명이 이루어지면서 웹 관련 컨텐츠나 그것들을 다룰 수 있는 툴, 또는 에뮬레이터들이 개발되고 있고, 이를 위해서는 웹 표준을 지향하는 웹킷을 이용하는 것이 좋다.
홈페이지 좌측에 있는 Working with the Code 를 차례대로 따라하면 웹킷을 이용하기 위한 툴 설치 및 코드 다운로드와 빌드, 실행, 디버깅하는 방법까지 알아낼 수 있다.
설치 파일이나 외부 경로에 대한 링크도 있고, 단계별로 설명이 잘 되어 있지만 환경에 영향을 많이 받고 꾸준히 업데이트 되는 웹킷 소스에 대해 플랫폼별로 예상결과가 다르다보니 빌드환경을 구성하는 데 시간을 많이 허비하게 된다.
이를 방지하기 위해 웹킷의 빌드환경을 구성하는 방법을 포스팅한다.
웹킷이 빌드되는 동안 실행되는 명령중 관리자 권한을 요구하는 것들이 있어 Command 를 열어 명령어를 입력할 때에는 관리자 권한으로 실행하여야 한다. 이를 항상 만족시키기가 어려운 경우가 있어 여기서는 아예 Administrator 계정으로 접속하였다.
또한 이 포스팅에서 설명하는 웹킷의 빌드는 아래와 같은 시스템 환경에서 테스트되었다.
[ SVN WebKit Repository ] 최종 업데이트된 리비전 : 153820
홈페이지 좌측의 Installing Developer Tools 를 클릭한다.
홈페이지에는
1. Visual Studio 2010 with Service Pack 1
2. Cygwin
3. QuickTime SDK
4. DirectX SDK
의 순서로 설치하도록 되어 있지만, 편의상 아래와 같이 순서를 바꾸어 설치하겠다.
1. Visual Studio CD 를 넣으면 아래와 같은 설치화면이 보인다.
Microsoft Visual Studio 2010 설치를 누른다.
2. 설치에 필요한 구성 요소를 준비하는 과정이 지나간다.
3. 준비가 끝나면 다음 버튼을 누른다.
4. 동의 안 하면 설치가 안되니 동의함에 체크한 뒤 다음버튼을 누른다.
5. 설치경로를 지정한 뒤 설치 버튼을 누른다.
6. 커피타임?
7. 설치가 완료되었다.
8. 끝내기를 누른다.
1. 아래 URL을 눌러 Microsoft Download Center 로 이동한다.
http://www.microsoft.com/en-us/download/details.aspx?id=8442 |
2. 화면 중간에 있는 Download 버튼을 클릭한다.
3. 각자의 환경에 맞는 파일을 선택한 후 Next 버튼을 클릭한다.
File Name |
Description |
GRMSDK_EN_DVD.iso |
X86 |
GRMSDKIAI_EN_DVD.iso |
Itanium |
GRMSDKX_EN_DVD.iso |
AMD64 |
4. 다운받을 경로를 선택하면 다운로드가 진행된다.
5. 가상의 DVD롬을 이용하거나, ISO 파일을 DVD로 만들어서 자동실행되는 setup.exe 를 실행시키면 아래와 같은 설치 마법사가 나타난다. Next 버튼을 클릭한다.
6. 동의하지 않으면 설치되지 않으므로 I Agree 에 체크한 뒤 Next 버튼을 클릭한다.
7. 설치경로를 확인한 뒤 Next 버튼을 클릭한다.
8. 설치항목을 검토한 뒤 Next 버튼을 클릭한다. 여기서는 Redistributable Packages 를 전부 설치하도록 옵션을 변경하였다.
9. Next 버튼을 눌러 설치를 시작한다.
10. 커피타임?
11. Finish 를 눌러 설치완료!
12. 인줄 알았으나 아래와 같은 창이 또 나타난다.
도움말 같은데 일단 설치해 보는 걸로.. 설치경로를 지정하고 OK 버튼을 누른다.
13. 설치항목들이 나열되는데 필요한 것만 골라서, 모를 땐 전부 Add 를 눌러 설치항목을 추가한다.
14. 전부 추가되었으면 Update 버튼을 누른다.
15. 도움말이라고 만만하게 봤지만 상당히 오래걸려서 밥을 먹고 왔다.
16. 설치가 완료되었다.
1. 여기까지 설치가 완료되었으면 이제 Windows Update 를 통해 보안업데이트를 받아야 한다. 시작 - 제어판 - 시스템 및 보안 - Windows Update 나 시작 - 모든 프로그램 - Windows Update 를 통해 실행하고 업데이트 설치 버튼을 누른다.
2. 업데이트에 필요한 파일들을 다운받고 모두 설치되면 다음과 같은 화면으로 바뀐다. 지금 다시 시작 버튼을 눌러 컴퓨터를 재부팅한다.
3. 재부팅이 완료되면 시작표시줄에 다음과 같은 팝업이 보일 것이다.
1. 아래 URL 을 눌러 Microsoft Download Center 로 이동한다.
http://www.microsoft.com/en-us/download/details.aspx?id=6812 |
2. 화면 중간에 있는 Download 버튼을 클릭한다.
3. 적당한 위치를 지정하여 다운받아 실행시킨다.
4. 다음
5. 동의하지 않으면 설치가 안되므로 I accept the terms in the license agreement 에 체크한 후 다음 버튼을 클릭한다.
6. 뭐.. DirectX SDK 의 무궁한 발전을 위해 익명의 사용자 정보를 빼가도 좋냐는거 같은데 여기선 뭘 선택해도 상관없다. 뭐든 선택하고 다음 버튼을 클릭한다.
7. 설치경로를 지정한 뒤 다음 버튼을 클릭한다.
8. 설치옵션을 확인한 뒤 다음 버튼을 클릭한다. 여기서는 DirectX Symbol Files 에 있는 것들을 전부 설치하도록 선택했다.
9. 잠깐 화장실을 다녀올 수 있는 시간이 생겼다.
10. 설치완료!
1. 아래의 URL 로 이동한다.
https://developer.apple.com/quicktime |
2. 우측 하단에 있는 Downloads and Tools 를 클릭한다.
3. 적당한 위치에 다운받은 파일의 압축을 해제하고 QuickTimeSDK.exe 를 실행한다.
4. Next 버튼을 클릭한다.
5. Yes 를 안누르면 설치가 안된다. Yes 버튼을 클릭한다.
6. 설치경로를 지정해주고 Install 버튼을 클릭한다.
7. 설치가 진행되는 동안 잠시 기다린다.
8. 설치가 완료되었다. Finish 버튼을 클릭한다.
1. 아래의 URL 을 눌러 Cygwin 설치파일을 다운로드받는다.
http://svn.webkit.org/repository/webkit/trunk/Tools/CygwinDownloader/cygwin-downloader.zip |
2. 다운로드받은 파일의 압축을 해제한다.
3. cygwin-downloader.exe 파일을 실행한다.
4. Cygwin 설치에 필요한 파일들을 다운받는 동안 잠시 기다린다.
5. 다운로드가 완료되면 다음과 같은 설치화면이 나타난다. 다음 버튼을 클릭한다.
6. Install from Local Directory 를 선택하고 다음 버튼을 클릭한다.
7. 설치경로를 확인한 뒤 다음 버튼을 클릭한다.
8. 3번에서 cygwin-downloader.exe 를 실행한 경로를 지정하고 다음 버튼을 클릭한다.
9. 뭔가 슝슝 지나가며 설치 준비를 한다.
10. 띠로리~ 에러가 아니다. 처음 설치하는 거면 무시해도 된다니 확인을 클릭한다.
11. 설치할 패키지를 선택할 화면이 나타난다.
12. 빨간색 박스가 쳐진 부분의 Default 를 클릭하면 설치옵션이 변경된다.
13. Install 로 변경되도록 클릭하고 다음 버튼을 눌러 전체 설치를 진행하자.
14. 설치가 진행될 동안 잠시 기다린다.
15. 설치가 완료되었다. 마침 버튼을 클릭한다.
1. Windows Key + R 을 눌러 실행창에 cmd 를 입력한다.
2. Windows Vista 나 Windows 7 을 쓰는 경우에 fork 명령이 올바르게 동작하지 않을 수 있다. 이를 방지하기 위해 아래 명령어를 입력해 주어야 한다.
> C:\cygwin\bin\ash.exe -c /bin/rebaseall |
3. 시작 - Cygwin - Cygwin Terminal 을 실행한다.
4. 다음 명령을 입력한다.
$ vi /etc/profile |
5. ESC 를 한번 누르고 다음을 입력하여 줄번호를 표시되게 한다.
:set nu |
6. TMP 와 TEMP 를 설정하는 부분을 찾는다. 여기서는 44번 라인부터 50번 라인.
7. 44번 라인부터 50번 라인까지 라인 앞부분에 #을 붙여 주석처리한다.
(i : 현재 커서가 위치한 곳에서 입력, dd : 현재 커서가 위치한 줄 삭제)
8. 다음을 입력하여 저장하고 편집모드를 종료한다.
:wq |
9. Windows + Pause Break 를 눌러 시스템 창을 연다.(or 컴퓨터 우측 클릭 후 속성)
10. 좌측메뉴에 고급 시스템 설정을 클릭한다.
11. 시스템 속성창 하단에 환경 변수를 클릭한다.
12. 시스템 변수에 새로 만들기 버튼을 클릭한다.
13. 다음 항목을 입력한다.
변수 이름 : CYGWIN_HOME 변수 값 : C:\cygwin |
14. 시스템 변수에서 Path 변수를 찾아 편집 버튼을 클릭한다.
15. 다음 값을 삽입한다.
%CYGWIN_HOME%\bin; |
16. 환경 변수 창에서 DXSDK_DIR, Path 등 값에 공백이 포함된 변수들을 찾아 ""로 감싸준다.
1. 시작 - Cygwin - Cygwin Terminal 을 실행한다.
2. 다음의 명령어를 입력하여 WebKit Source 를 다운로드 받는다.
svn checkout https://svn.webkit.org/repository/webkit/trunk WebKit |
3. 잠시 후 뭔가 엄청난 것이 밀려온다.
4. 네트워크가 불안정하거나 정전이 되거나 모뎀으로 연결했는데 전화오거나 기타등등의 이유로 checkout 도중에 중지되는 경우가 있다.
5. 이럴 땐 다음의 명령어를 이용하여 해결하도록 하자.
$ svn cleanup $ svn update ./WebKit/ |
6. 다시 업데이트가 진행된다.
7. 밥먹고 커피먹고 샤워하고 한참을 기다리면 업데이트가 완료된다.
1. 아래의 URL 로 이동하면 동의서가 나온다.
https://developer.apple.com/opensource/internet/webkit_sptlib_agree.html |
2. 화면 끝까지 스크롤한 뒤 동의하고 Download 버튼을 누른다.
3. 위에서 WebKit Source 를 checkout 한 폴더에 파일을 다운로드한다. 모든 프로그램을 기본으로 설치했다면 경로는 C:\cygwin\home\사용자계정\WebKit 일 것이다. 압축을 해제하지 않고 압축파일 형태 그대로 저장한다.
4. 다운로드받은 WebKitSupportLibrary.zip 파일을 복사하여 따로 압축해제한 뒤에 WebKitSupportLibrary\win\include 에 있는 모든 파일을 복사한다.
5. C:\cygwin\home\username\WebKit\WebKitLibraries\win\include 로 이동한다.
6. 복사한 파일을 전부 붙여넣기 한다.
1. 빌드에 앞서 WebKit 소스를 최신으로 업데이트 하자. 시작 - Cygwin - Cygwin Terminal 을 실행한다.
2. 다음의 명령어를 입력하여 WebKit Source 를 업데이트한다.
$ cd WebKit $ ./Tools/Scripts/update-webkit |
3. WebKit 의 소스는 수시로 업데이트되고 있으므로 위의 명령어를 입력하였을 때, 업데이트가 진행이 될 수도 있고, 최신의 버전이면 안될 수도 있다.
4. WebKit 의 소스 업데이트와 무관하게 최초 한 번은 update-webkit 을 실행하였을 경우 아래와 같이 WebKitAuxiliaryLibrary 설치와 환경변수를 등록하게 된다.
Installing WebKitAuxiliaryLibrary... The WebKitAuxiliaryLibrary has been sucessfully installed in /home/s2junn/WebKit/WebKitLibraries/win Setting the Environment Variable 'WEBKIT_LIBRARIES' to 'C:\cygwin\home\s2junn\WebKit\WebKitLibraries\win' Setting the Environment Variable 'WEBKIT_OUTPUTDIR' to 'C:\cygwin\home\s2junn\WebKit\WebKitBuild' Please restart your computer before attempting to build inside Visual Studio. |
5. Cygwin Terminal 을 종료한다.
6. 시작 - Microsoft Visual Studio 2010 - Microsoft Visual Studio 2010 을 실행한다.
7. 파일 - 열기 - 프로젝트/솔루션을 선택한다.
8. Cygwin 이 설치된 폴더(C:\cygwin) 하위에에 WebKit.sln 을 찾아서 연다. (C:\cygwin\home\username\WebKit\Source\WebKit\WebKit.vcxproj\WebKit.sln)
9. 규모가 있는 프로젝트라 시간이 꽤 걸린다. 하단에 프로젝트 로드 진행되는 과정이 표시되고 있으니 차분하게 로드를 마칠때까지 기다린다.
10. 준비상태가 되면 이제 오른쪽을 살펴보자.
11. WebKit 은 여러 프로젝트의 모음으로 되어있다. 솔루션 탐색기의 트리를 살펴보면 Tools - DumpRenderTree Projects 밑에 DumpRenderTree 프로젝트가 있다. DumpRenderTree 를 오른쪽으로 클릭하여 속성을 클릭하자.
12. 상단에 구성메뉴를 눌러 모든 구성을 선택한다.
13. 구성 속성 - C/C++ - 명령줄을 선택하고 오른쪽 하단의 추가 옵션에 /wd4819 라고 적은 뒤 적용, 확인 버튼을 클릭한다. (error C4819: 현재 코드 페이지(949)에서 표시할 수 없는 문자가 파일에 들어 있습니다. 에 대한 해결방법)
14. 위와 같은 방법으로 QTMovieWin, WebCore, WebKit, TestNetscapePlugin 프로젝트에 대해서도 /wd4819 를 명령줄에 추가한다.
14. 파일 - 모두 저장 을 눌러 프로젝트를 저장한다.
15. 솔루션 'WebKit' 은 36개의 프로젝트가 합쳐진 형태로 되어 있다. 빌드시에는 각각의 프로젝트 단위로 빌드되며 각각의 프로젝트는 의존관계를 가지고 있어 순서대로 빌드되어야 한다. 우측의 솔루션 탐색기를 모두 펼쳐보자.
16, 솔루션 'WebKit' (36 프로젝트) 를 선택하고 오른쪽 마우스 버튼을 클릭한 뒤 프로젝트 빌드 순서 메뉴를 클릭한다.
17. 솔루션 'WebKit' 은 다음과 같은 빌드 순서를 따른다.
18. 최초 빌드시에는 솔루션을 전체 빌드하면 많은 시간이 소요되고 성공적으로 빌드되리라는 보장이 없기 때문에 각각의 솔루션별로 빌드하여 먼저 에러를 검출 및 수정하고 모든 프로젝트가 성공적으로 빌드된 이후부터 전체 빌드를 사용하길 권장한다. 우선 직접적으로 WebKit 빌드와 상관없는 Test 를 위한 프로젝트들은 제외한다. 아래의 프로젝트들을 선택한 후 마우스 오른쪽으로 클릭하여 프로젝트를 언로드시킨다.
JavaScriptCore Projects/jsc JavaScriptCore Projects/testapi JavaScriptCore Projects/testRegExp Tools/APITest Projects/gtest-md Tools/APITest Projects/TestWebKitAPI Tools/DumpRenderTree Projects/DumpRenderTree Tools/DumpRenderTree Projects/DumpRenderTreeLauncher Tools/DumpRenderTree Projects/ImageDiff Tools/DumpRenderTree Projects/ImageDiffLaauncher Tools/DumpRenderTree Projects/TestNetscapePlugin WebCore Projects/WebCoreTestSupport |
19. 솔루션 탐색기의 최종적인 모습은 다음과 같다.
1. EXEC : cygwin warning :
MS-DOS style path detected: ......
Preferred POSIX equivalent is: ......
MS-DOS 에서는 역슬래시(\)를 이용하여 경로를 구분하였고, POSIX 에서는 슬래시(/)를 이용하여 경로를 구분하였다. 윈도우 환경에서 cygwin 을 이용하여 작업을 하게 될 경우에는 두 기반의 경로 구분에 차이가 생기게 된다. cygwin 에서 발생하는 warning 을 무시해도 되지만, 다른 warning 이나 error 메시지를 보기에도 불편하고 기분상 찝찝해지는 것은 어쩔 수 없기에 이를 나타내지 않게 해주는 것이 좋다.
친절하게도 warning 과 함께 이 메시지를 보이지 않게 하는 방법을 같이 나타내주고 있다.
CYGWIN environment variable option "nodosfilewarning" turns off this warning. |
CYGWIN 환경변수를 만들어주자.
1) Windows Key + Pause | Break 를 누른다.
2) 좌측 메뉴에 고급 시스템 설정을 클릭한다.
3) 시스템 속성창 하단에 환경 변수를 클릭한다.
4) 시스템 변수에 새로 만들기 버튼을 눌러 새 시스템 변수를 만든다.
2. 6>C:\Program Files\MSBuild\Microsoft.Cpp\v4.0\Platforms\Win32\Microsoft.Cpp.Win32.Targets(147,5): error MSB6001: "CL.exe"
아래 사이트에 가면 Visual Studio 2010 을 사용할 때 cygwin 설치시 설정사항에 대해 나와 있다.
edit /etc/profile and comment out the block that sets up $TMP and $TEMP,
then close and re-open your shell
1) 시작 - Cygwin - Cygwin Terminal 을 실행시킨다.
2) 다음 명령을 입력한다.
$ vi /etc/profile |
3) ESC 를 한번 누르고 다음을 입력하여 줄번호를 표시되게 한다.
:set nu |
4) TMP 와 TEMP 를 설정하는 부분을 찾는다. 여기서는 44번 라인부터 50번 라인.
5) 44번 라인부터 50번 라인까지 라인 앞부분에 #을 붙여 주석처리한다.
6) 다음을 입력하여 저장하고 편집모드를 종료한다.
:wq |
3. error C1083: 포함 파일을 열 수 없습니다. 'd3dx9.h': No such file or directory
1) Microsoft DirectX SDK 를 설치하지 않았다면 설치한다.
2) Microsoft DirectX SDK 를 설치했다면 해당 error 가 발생한 프로젝트를 살펴보자.
3) 솔루션 탐색기에서 error 가 발생한 WebCore 프로젝트를 선택하고 마우스 오른쪽 버튼을 클릭하여 속성 메뉴를 누른다.
4) Microsoft DirectX SDK 가 설치된 경로를 찾아본다. 설치경로를 수정하지 않았다면 C:\Program Files\Microsoft DirectX SDK (June 2010) 과 같은 경로에 설치되었을 것이다. 설치된 경로를 복사해둔다.
5) 구성 속성 - VC++ 디렉터리를 선택하고 아래 내용을 추가한다.
실행 가능 디렉터리 : DirectX SDK 설치경로\Utilities\bin\x86; 포함 디렉터리 : DirectX SDK 설치경로\Include; 라이브러리 디렉터리 : DirectX SDK 설치경로\Lib\x86; |
4. warning LNK4099: 'vc100.pdb' PDB를 'WebKitSystemInterface.lib(QuickTimeSystemInterface.obj)' 또는 'C:\cygwin\home\s2junn\WebKit\WebKitBuild\Debug\bin32\vc100.pdb'에서 찾을 수 없습니다. 디버그 정보가 없는 것처럼 개체를 링크합니다.
Debug 모드로 빌드를 하면 Debug 정보가 빌드 결과물에 포함된다. 이 Debug 정보로 이루어진 파일이 "pdb" 확장자를 가지는데 Windows 시스템의 특징상 라이브러리를 링크하여 사용하다보니 이미 빌드된 라이브러리의 Debug 정보는 포함할 수 없다.
warning LNK4099 는 이미 빌드된 라이브러리의 Debug 정보에 접근할 수 없다는 경고로 동작에는 아무런 지장이 없지만 오류 목록에 표시되어 신경이 쓰인다.
2) 구성 속성 - C/C++ - 일반 메뉴에서 디버그 정보 형식을 /Z7 으로 수정한 뒤 적용 버튼을 클릭한다.
1) JavaScriptCore 에 있는 JSExportMacros.h 를 찾을 수 없어서 생기는 error 이다. 이 파일의 경로는 "JavaScriptCore/runtime/" 으로 변경되었다. 해당 에러 문구(20번 )을 더블클릭하여 파일을 연다.
2) 3번 라인의 include 문의 경로를 "JavaScriptCore/runtime/JSExportMacros.h" 로 수정한다.
1) 해당 error 를 더블클릭한 뒤 경로를 "disassembler/Disassembler.h" 로 수정한다.
utils-patcher
web-wget
rebaseall
2) 아래 명령어를 입력한다.
> C:\cygwin\bin\ash.exe -c /bin/rebaseall |
1) 해당 프로젝트의 속성창을 연다.
2) 구성 속성 - 링커 - 입력 메뉴를 선택하고 우측의 추가 종속성에 있는 CoreFoundation$(DebugSuffix).lib; 를 지우고 적용버튼을 누른다.
'Major Field' 카테고리의 다른 글
| 소프트웨어 사용권(Software license) (0) | 2012.05.02 |
|---|---|
| Tortoise SVN 에서 Edit log message 사용하기 (0) | 2012.01.06 |
| Tortoise SVN을 Command로 활용하기 (0) | 2011.10.04 |
| ORACLE VirtualBox Installation (0) | 2010.03.31 |
