2017-01-03 4 views
0
내가 index.html 파일에서 노드 모듈에 액세스 할 수 Browserify을 사용하고

을 bundle.js 포함 후 index.html을에서 참조 할 수 없습니다Browserify 모듈 스크립트

내가있는 모듈을 가져 오기 (구글 앱 엔진에서 호스팅) 내가의 Browserify 문서의 표준이 보는 바와 같이 "main.js"파일은 다음과 같이

browserify main.js -o bundle.js 
:

var request = require('request'); 
var fs = require('fs'); 

내가 다음 명령을 사용하여 bundle.js 파일에이를 번들

그러면 필요한 bundle.js 파일이 성공적으로 생성됩니다. 다음과 같이 그때 내 index.html을의 헤더 상단에이이 포함 된 index.html의 신체 내의 스크립트 행을 사용 loader.js 내에서 함수를 호출합니다

<HEAD> 
    <script src="/scripts/bundle.js"></script> 

    <script src="/scripts/util/loader.js"></script> 
    <!-- More scripts below here --> 

request('api.my-url.com/world').pipe(fs.createWriteStream('/resources/myMap.json')); 

응답 내용이 포함 된 파일을 만들 때 사용합니다. 그러나, 나는 GAE에이를 배포 및 액세스 index.html을, 나는 오류 메시지로 인사하고있다 :

loader.js:15 Uncaught ReferenceError: request is not defined 
    at loadWorld (loader.js:15) 
    at Object.create ((index):55) 

나는 시도하고() 요청을 이동 내가 할 index.html을의 스크립트로 호출하는 경우 동일한 문제이지만 main.js로 줄을 옮기면 더 이상이 문제가 발생하지 않습니다.

나는 이것이 자바의 개인적인 오해라고 생각하지만, bundle.js가 스크립트를 통해 index.html에 포함 된 후에 index.html에서 요청 개체를 사용할 수없는 이유를 알 수없는 것 같습니다. 꼬리표.

상황에 대해 밝힐 수있는 사람 덕분에 고마워.

+0

일반적으로 번들에는 전체 응용 프로그램이 포함됩니다. 당신은'requrec'을'index.html'의 추가 스크립트에 사용하기 위해 번들링하고 있습니까? 그렇다면 답은 매우 간단합니다. 그러나'fs '를 잘못 사용하면 문제가 이해하기 어려워집니다. 결코 작동하지 않을 것입니다. 당신이하려는 것을 단순한 진술로 줄일 수 있습니까? – cartant

답변

1

browserify 번들을 만들면 응용 프로그램의 "진입 점"이됩니다. 하지만 여기서 index.html에 엔트리 포인트가있는 것처럼 보이므로 독립 실행 형 라이브러리를 번들로 묶는 것이 좋습니다. https://github.com/substack/browserify-handbook#standalone

당신은 UMD 번들해야한다 거의 같은 방법으로 그것을 호출하지만 (글로벌 네임 스페이스에) 어떤 이름을 지정합니다

Browserify 대신 UMD 번들을 생성하여이 작업을 수행 할 --standalone라는 옵션을 가지고 주어진. 예 : 당신이 당신의 HTML에 <script src="bundle.js"></script>을 포함 할 때

browserify foo.js --standalone mylib > bundle.js

지금, 그 다음 스크립트는 mylib 개체를 참조 할 수있을 것이다. 당신이 원하는 경우

는, 브라우저에서 사용할 수있는 request 같은, https://www.npmjs.com/package/xhr 아주 있습니다 여기에

--standalone 옵션을 사용의 예 유사한 API.