2014-02-20 5 views
1

저는 모듈화를 위해 RequireJS를 사용하는 백본 앱에서 작업 해 왔습니다. 나는 그것에 대해 잘 알고 있지만 지금은 배포 준비가 끝났으므로 하루 종일 r.js와 싸워 왔고 정말로 붙어 있습니다. 나는 앱을 어떤 에러없이 빌드 할 수있게 만들었지 만, 최적화 된 빌드를 실행하려고하면 내 출력 파일에 빌드 된 여러 파일을 무시합니다.여전히 jQuery 최적화 된 빌드가 외부 jQuery 파일을로드하려고합니다.

({ 
    appDir: "main-app", 
    baseUrl: "js", 
    mainConfigFile: "main-app/js/main.js", 
    dir: "build", 
    optimize: "none", // for debugging this issue 
    findNestedDepencencies: false, // 'true' isn't needed, and didn't fix the issue anyway 
    removeCombined: true, 
    modules: [ 
     { name: "main", exclude: ["vendor"] }, 
     { name: "vendor" } 
    ], 
    wrap: true 
}) 

main.js 파일은 이제 주 동안 최적화되지 않은 모드에서 작업되었습니다 여기 내가 사용하고있어 (지면 관계 상 편집 됨)입니다 build.js 파일입니다. vendor는 단지 그들이로드하고 최적화 청소기를 만들 수 있도록하는 데 사용되는 모든 제 3 자 라이브러리를 필요로하는 빈 모듈

requirejs.config({ 
    shim: { 
     handlebars: { exports: 'Handlebars' }, 
     underscore: { exports: '_' }, 
     backbone: { deps: ['underscore', 'jquery'], exports: 'Backbone' }, 
     marionette: { deps: ['backbone'], exports: 'Marionette' } 
    }, 
    paths: { 
     jquery: "vendor/jquery/jquery", 
     handlebars: "vendor/handlebars/handlebars", 
     backbone: "vendor/backbone/backbone", 
     underscore: "vendor/underscore/underscore", 
     marionette: "vendor/marionette/backbone.marionette", 
     hbs: "vendor/require-handlebars-plugin/hbs" 
    }, 
    hbs: { 
     helperDirectory: "common/templates/helpers/" 
    } 
}); 

requirejs(['vendor', 'app', 'controllers'], function(Vendor, Application) { 
    Application.start(); 
}); 

(나는 주와 끝까지 : 여기에 해당 파일의 단순화 된 버전입니다. js 파일, 제 3 자 코드가있는 vendor.js 파일). controllers 파일은 대부분의 응용 프로그램 모듈과 마찬가지로 동일합니다.

제가하는 데 문제는, 컴파일 및 최적화 된 응용 프로그램을 실행 한 후, 여전히 나는 그들이있는 것을 볼 수 있습니다에도 requirjs.config 블록에 나열된 경로에서 hbs, jqueryunderscore를로드하려고하는 요구이다 vendor.js으로 컴파일됩니다. 어떻게 것

if (typeof define === "function" && define.amd) { 
    define("jquery", [], function() { 
     return jQuery; 
    }); 
} 

나는 hbs 컴파일을 얻으려고 많은 시간을 소요, 그래서 나는 여전히이 문제를 일으키는 여부를 결정하기 위해 노력하고있어,하지만 난 모르겠어요.

+0

'공급 업체'모듈의 내용을 질문에 추가 할 수 있습니까? 간단 할 수도 있지만이 모듈에서 실수를 저지르는 것이 가능합니다. – Louis

답변

0

나는 마침내이 작업을했습니다. 핵심 쟁점은 포함 순서와 관련이있었습니다. 기본적

Application.on("initialize:after", function() { 
    require(['controllers'], function() { 
     ... history, setup, etc... 
    }); 
}); 

I 보장하는데 필요한 didn를 순환 적 의존성은 없었다 (이 네트로 애플리케이션이다) app.js에이어서

requirejs(['vendor'], function() { 
    requirejs(['app'], function(Application) { 
     Application.start(); 
    }); 
}); 

: main.js에서 I는 이에 초기화 호 투입 생산 중에 나타나지 않습니다.

Marionette 이후로 표시되지 않는 한, 그 꼭대기에, 나는 또한에 대한 심의가 작동하지 이후, 핸들 바의 AMD-랩 버전으로 전환하고, Backbone.Marionette 될하기 위해 마리오네트 심에 exports 전환 전역 변수.

나는 대부분의 방법을 얻는 데 매우 도움이 될 것이라고 this article 발견했습니다.

2

empy: directive을 찾고 계십니까? 비울 수있는 경로를 지정 빌드 설정에서

,

({ 
... 
paths : { 
    'jquery' : 'empty:' 
}, 
}) 

는 외부에서로드 r.js을 알려줍니다.

+0

불행히도, 아니요. 그저 jQuery를로드하려고하면 작동하지만 문제는 실제로 모든 타사 라이브러리에서 발생합니다. Require는 main에서 'paths'설정을 사용하려고합니다.js는'vendor.js'에서 인라인 된 등록 된 모듈에 의존하는 대신 모든 것을로드합니다. 덧붙여 말하자면, 최적화 된 빌드에서 shimmed 모듈의 의존성이 있다면 라이브러리의 CDN 버전을 사용할 수 없습니다. 이것은 내가 배운 새로운 것입니다 : "shim"config에 대한 중요한 옵티 마이저 노트 (http : // requirejs.org/docs/api.html#config-shim) –

+0

@ ken.dunnington 아, 알겠습니다. 나는 당신의 문제를 오해했습니다. – Andrew