RequireJS 모두 필요 흐름과 인라인

Question

내부 AMD 모듈로드는 이것을 고려

//global.js 
$.getScript("modular_bar.js"); 

모두 modular_foo 및 modular_bar는 익명으로 정의 된 AMD 모듈입니다. requireJS를 사용하면 위의 내용을로드하면 가장 좋은 오류 인 mismatched anonymous define() modules이 표시됩니다.

오류가 발생하는 이유는 충분히 이해할 수 있습니다 (알고 싶으면 해당 페이지를 읽으십시오).하지만 문제가 발생하면 어떻게 될까요?

저는 RJS 플로우로 점진적으로 마이그레이션되는 기존 플랫폼에서 작업하고 있습니다. 인라인 레거시 스크립트 (일부는 AMD 검사를 통해 define()을 트리거합니다)와 우리의 요구 사항 동시에 진입 점.

경우에 따라 require.js 라이브러리를로드하는 것 위에 인라인 AMD 호환 스크립트를 배치 할 수 있지만 DOM 내용에 따라 다른 항목 (modular_bar.js)을 비동기 적으로로드해야하는 경우에는 작동하지 않습니다. 또한 RJS에 외부 적으로로드되는 파일에서 모든 AMD 검사를 주석 처리 할 수는 있지만 모듈 식 흐름으로로드되는 것과 호환되지 않게됩니다.

누구나 비슷한 경험을 했나요? 이런 종류의 갈등을 극복하기 위해 당신의 흐름을 어떻게 혼합합니까?

Answer 1

프로덕션 환경에서이 솔루션을 사용해 본 경험이 없지만이 질문에 대해 가장 좋은 방법을 생각해 보았습니다.

eval을 통해 전달되는 경우 익명 define을 실행할 수 없도록 수정 된 RequireJS 라이브러리를 사용할 수 있습니다. 또한 아래의 스 니펫에서 name에있는 문자열에 대한 유형 검사를 제거하여 define 호출을 허용하지 않을 수 있습니다.

다음 스 니펫은에 의해 호출되는 경우 익명 정의를 무시하는 RequireJS에 대한 수정입니다. fully modified require.js in this GitHub Gist을 찾을 수 있습니다.

코드는 parse-stack library에 의존합니다. RequireJS 앞에 라이브러리를 포함 할 수 없다면, 파일의 맨 위로 연결하는 것이 좋습니다.

Demo

// This is a snippet of RequireJS 
// ... 
define = function (name, deps, callback) { 
    var node, context; 

    // We will allow named modules to be defined by `eval` 
    if (!(typeof name == 'string' || name instanceof String)) 
    { 
     var stack = parseStack(new Error()); 

     // If we find any eval in the stack, do not define the module 
     // This is to avoid the "Mismatched anonymous define() module" error 
     // Caused by executing an anonymous define without requireJS 
     for(var i = 0; i < stack.length; i++) 
     { 
      if(stack[i].name == "eval") 
      { 
       return; 
      } 
     } 
    } 

    // ...