2

Google 클로저 라이브러리를 실험 중이며 the official XhrIo guide을 통해 작업하고 있습니다. 내가 xhr-quick2.js 예를 몇 가지 문제로 실행, 아래의 재현 : 나는 getData 내에서 이벤트 리스너 및 XHR의 인스턴스를 이동하면컴파일하지 않고 클로저 라이브러리의 goog.required 객체에 접근하기

Uncaught TypeError: Cannot read property 'XhrIo' of undefined

: 실행하면

goog.require('goog.net.XhrIo'); 

var xhr = new goog.net.XhrIo(); 

goog.events.listen(xhr, goog.net.EventType.COMPLETE, function(e) { 
    obj = this.getResponseJson(); 
    log('Received Json data object with title property of "' + 
     obj['title'] + '"'); 
    alert(obj['content']); 
}); 

function getData(dataUrl) { 
    log('Sending simple request for ['+ dataUrl + ']'); 
    xhr.send(dataUrl); 
} 

, 나는 오류가 나타납니다 기능 (신체의 onload이라고 부름)은 모두 정상입니다.

goog.require('goog.net.XhrIo') 

function getData(dataUrl) { 
    var xhr = new goog.net.XhrIo() 

    goog.events.listen(xhr, goog.net.EventType.COMPLETE, function(e) { 
    obj = this.getResponseJson() 
    log(`Received Json data object with title property of "${ obj["title"] }"`) 
    alert(obj["content"]) 
    }) 

    log(`Sending simple request for [${ dataUrl }]`) 
    xhr.send(dataUrl) 
} 

function log(msg) { 
    document.getElementById('log').appendChild(document.createTextNode(msg)); 
    document.getElementById('log').appendChild(document.createElement('br')); 
} 

나는 goog.requiregoog.net.XhrIo이 첫 번째 코드 샘플의 3 행에 인스턴스화 될 때 net를 가져 오기가 완료되지 않았기 때문에이 가정. 이상적인 솔루션은 클로저 컴파일러를 통해 모든 코드를 실행하는 것입니다.하지만 저는 단지 입니다. other parts of the documentation 내 워크 플로를 개발할 수 있음을 나타냅니다.

수동으로이 HTML을 제거 할 수있는 소스가 있습니까? 문제가 있습니까? 내가 취해야 할 다른 접근법이 있습니까?

답변

2

마지막으로 클로저로 작업 한 이후로 몇 년이 지났지 만, 의존성 컴파일러 없이는 require 만 사용할 수 있다고는 생각하지 않습니다.

클로저는 goog.modulegoog.require에 대한 JavaScript 파일을 스캔하여 deps.js 파일을 작성합니다. 이 파일은 JavaScript 파일보다 먼저로드되어야합니다. 코드에서 사용하는 모든 모듈을 나열하고 올바른 순서로로드합니다.

deps.js이 먼저 오는 경우 코드에 도달 할 때까지 goog.net이로드됩니다. 첫 번째 온라인 코드 goog.require('goog.net.XhrIo')은 현재 무시됩니다.

이 문서에 따르면 goog.require 실행되는 현재 <script><script>태그를 삽입한다. 따라서 deps.js을 사용하는 단계를 건너 뛰려면 문서 준비 콜백에서 모든 것을 마무리해야합니다. 그렇지 않으면 코드 앞에로드 된 JavaScript 파일에 goog.require을 추가하십시오.

폐쇄성 작성기를 사용하여 deps.js 파일을 만드는 것이 그만한 가치가 있다고 생각합니다.

여기에 빠른 튜토리얼있다 :

https://www.safaribooksonline.com/library/view/closure-the-definitive/9781449381882/ch01.html

가 여기에 deps.js 파일을 작성하기위한 CLI있어 :

python ../closure-library/closure/bin/calcdeps.py \ 
    --dep ../closure-library \ 
    --path my_stuff.js \ 
    --output_mode deps > deps.js 
0

컴파일되지 않은 모드의 경우는, 필요한 문서는 사전에로드해야합니다. 그래서 귀하의 HTML 문서에 당신은 :

<!DOCTYPE html> 
<html> 
    <head> 
    <script src="path/to/closure/base.js"></script> 
    <script> 
     goog.require('goog.net.XhrIo'); 
    </script> 
    <script src="mysource.js"></script> 
    </head> 
</html> 

별도의 스크립트 태그에 모든 종속성을로드해야합니다.위의 코드 샘플이 작동해야합니다.

관련 문제