curl.js로 작업하려면 어떻게 정의해야합니까?

Question

AMD 모듈을 작성하는 것에 대해 Addy Osmani's excellent blog post을 읽습니다. 나는 자신의 게시물에서 해제 JS의 단순한 덩어리로 시작 :

define('modTest', [], 
    // module definition function 
    function() { 
     // return a value that defines the module export 
     // (i.e the functionality we want to expose for consumption) 

     // create your module here 
     var myModule = { 
     doStuff:function(){ 
      console.log('Yay! Stuff'); 
     } 
     } 

     return myModule; 
    } 
); 

내가 foo과 bar에 의존성을했다. 콘솔에 기록하는 간단한 개체 만 있으면됩니다.

그래서 나는 /js/modTest.js에 그 내용을 저장 한 다음로드하려고 :

curl(['/js/modTest.js']) 
.then(function(mt) { 
    console.log("Load complete"); 
    console.log("mt:"); 
    console.log(mt); 
    mt.doStuff() 
    }, function(ex) {alert(ex.message);}) 

결과 : 오류 : Multiple anonymous defines in URL합니다. OK는 작동하지 않았습니다. 네임 스페이스에서 추가 시도 : define('myCompany/modTest', [],, 동일한 결과. 의존성 배열에 빈 문자열을 추가하려고했는데 같은 결과가 나타납니다.

curl(['modTest.js'], function(dep){console.log(dep)});도 같은 결과가 나타납니다.

Addy의 블로그 게시물에있는 코드가 올바르지 않습니까? 내가 뭔가 잘못하고 있는거야? 아마 컬의 버그일까요? 5/24

업데이트 : 나는 require.js 찬성 curl.js 버렸어. 제로 홀수 오류, 전환 할 작업이 거의 없습니다. 클라이언트 코드와 서버 코드를 얻기 위해 amdefine을 다루어야했는데 (하나의 객체가 두 위치에 있으므로 grunt가이를 처리하도록 구성되어야했습니다). 내 정의는 일반적으로 다음과 같습니다.

define(-> 
    class AlphaBravo 
    ... 

로드하는 데 문제가 없습니다.

Answer 1

"/js/modTest.js"라는 모듈을 가져 오도록 curl()에게 요청했습니다. 파일을 찾은 후로드하고 "modTest"라는 모듈을 발견하여 불평했습니다. :) (즉, 오류 메시지가하지만, 끔찍하게 잘못입니다!)

여기 당신이 그것을 해결할 수있는 방법 (하나를 선택) :

1)에서 ID를 제거하여 정의(). ID는 권장되지 않습니다. 이것은 일반적으로 AMD 빌드 툴과 테스트 하니스 안에 모듈을 선언 할 때만 사용됩니다.

2) define()에서 지정한 ID로 모듈을 참조하십시오. (다시, ID는 대부분의 경우에 권장되지 않습니다.)

curl(['modTest'], doSomething); 

3) 응용 프로그램의 모듈 폴더에 패키지 (또는 경로)를지도. modTest가 독립 실행 형 모듈 인 것처럼 보이기 때문에 귀하의 예제에서 어떤 것이 나왔는지 분명하지 않습니다. 당신이 modTest 모듈에 의존하는 코드가있을 때

다음

packages: [ { name: 'app', location: 'app' } ] 

, 당신이 얻을 수있는 : 당신은 "응용 프로그램"패키지에서 앱의 파일을 정리하기로 결정했다 경우에는, 당신은 설정은 다음과 같을 수 패키지 ID는 "app/modTest"입니다.

curl(['app/modTest'], doSomething); 

분명히 도움이 되길 바랍니다.

Fwiw, Addy의 예제가 실제로 올바른 구성에서 작동 할 수 있지만 해당 구성에서 구성이 표시되지 않습니다 (또는 내 눈이 놓친 경우). 이런 식으로 뭔가를 작동 할 수 있습니다 :

packages: [ { name: 'app', location: '.' } ] 

- 존

Answer 2

저는 다른 라이브러리에 사용했던 포함 순서로 판명 된 것과 비슷한 문제가있었습니다. handlebars.js, crossroads.js, jquery 및 몇 가지 다른 라이브러리를 기존 프로젝트 (머리에 스크립트 태그)로로드하고 있는데 curl.js를 먼저 포함 시키면이 오류가 발생하지만 마지막으로 포함 시키면이 오류가 발생하지 않습니다.

내 머리 태그는 이제 다음과 같습니다

<script type="text/javascript" src="/js/lib/jquery.js"></script> 
<script type="text/javascript" src="/js/lib/signals.js"></script> 
<script type="text/javascript" src="/js/lib/crossroads.js"></script> 
<script type="text/javascript" src="/js/lib/handlebars.js"></script> 
<script type="text/javascript" src="/js/lib/curl.js"></script> 
<script type="text/javascript" src="/js/main.js"></script> 

Answer 3

당신은 당신의 define 전화에 문제가 있습니다. 지금

define(/* this is where the difference is */ function() { 
     // return a value that defines the module export 
     // (i.e the functionality we want to expose for consumption) 

     // create your module here 
     var myModule = { 
     doStuff:function(){ 
      console.log('Yay! Stuff'); 
     } 
     } 

     return myModule; 
    } 
); 

지루한 설명 :

을

여기에 정의를 쓸 수 있지만 방법에 대한 전체 이야기에 대한 AMD spec를 참조 이라는 것은 내가 당신의 js/modTest.js 파일에 볼 것으로 예상 할 것입니다

CurlJS는 굉장합니다. 사실, RequireJS와 CurlJS를 다룬 후에 CurlJS는 RequireJS보다 한 가지 카테고리 - 스크립트 실행 순서의 신뢰성 -이라고 말할 수 있습니다. 그래서 당신은 올바른 길을 가고 있습니다.

CurlJS와 다른 주요한 점은 "로드 된 모듈 당 적어도 하나의 익명 정의를 찾아야합니다. 그렇지 않으면 오류가 있습니다"논리입니다. RequireJS는 시간 초과를 사용하여 주어진 파일에 아무것도 정의되지 않은 경우를 효과적으로 무시하지만로드/파싱 오류를 포착하여 폭발적으로 증가시킵니다.

그 차이가 여기에 있습니다.CurlJS는 적어도 하나를 예상합니다 익명 (NOT 명명 된 것과 같이)은로드 된 모듈마다 정의합니다. 예상대로 잘 명명 된 정의를 처리합니다. 두 번째로 "js/modTest.js"의 내용을 인라인 코드로 옮기면 정의의 이름을 지정해야합니다. 그러나 그것은 또 다른 이야기입니다.