2014-05-12 15 views
30

대용량 응용 프로그램에서 각도 의존성을 비동기 적으로로드하고 싶습니다.이 경우 Browserify 또는 Webpack 사이를 결정하려고합니다. 각도 2.0이 기본적으로이 기능을 지원하지만 현재로서는 잘 지원되고 인기있는 솔루션을 찾고 있습니다.각도 1.x에서 종속성을 느리게로드하기 위해 Browserify 또는 Webpack을 사용해야합니까?

각도 팀에서 가장 잘 맞는 방법과 프로젝트를 구성하는 데 가장 적합한 방법에 대해 조언을 제공 할 수있는 사람이 누구나 있습니다.

답변

43

우리 회사에서는 browserify에서 webpack으로 전환했습니다. 그 이유 중 하나는 게으른 로딩 중 하나입니다.

browserify에서 여러 번들에 물건을 넣는 것은 특별한 코드뿐만 아니라 몇 가지 설정을 변경했습니다. 여기에 대한 훌륭한 안내서가 있습니다 http://esa-matti.suuronen.org/blog/2013/04/15/asynchronous-module-loading-with-browserify/

webpack을 사용하면 새 번들을 추가하면 구성 항목 파일 행에 추가 항목 파일 행이 추가됩니다. 여기에 대한 빠른 안내가 있습니다 : https://github.com/petehunt/webpack-howto#7-multiple-entrypoints. 게으른 로딩의 경우 구성 파일에서 아무 것도 변경하지 않아도됩니다. 여기에 설명 된 비동기식 require 구문을 사용하십시오. https://github.com/petehunt/webpack-howto#9-async-loading

다음은 매우 유사한 설정을위한 템플릿입니다. 우리가 생산에서 https://bench.co에 사용하는 것. https://github.com/jeffling/angular-webpack-example/

+2

[웹팩과 꿀꺽 거리기를 추가하는 단계가있는 각도 폰캣 튜토리얼 확장] (https://github.com/escapedcat/angular-phonecat-webpack-gulp). 매우 간단한 단계별 예제. – escapedcat

+0

감사합니다. Jeff! 혹시 런타임에 여분의 모듈이나 컨트롤러를로드하는 방법을 보여주기 위해 webpack 예제를 확장 할 수 있습니까? – Nikos

+0

@Nikos 문제는 없습니다. 예를 들어, 사람들이 지금 극단적 인 barebones-ness이기 때문에 유용하다고 느낄 수 있기 때문에 실제로 그 것을 예제에서 제외 할 수 있습니다. 아마도 우리는 프로젝트에서이 문제에 관해 이야기 할 수있을 것입니다. 하나 만들면 거기서 채팅 할 수 있니? 각도 모듈 시스템이 작동하는 방식 때문에 런타임에 지연로드하는 것이 다소 복잡합니다. Pete hunt의 예 + https://github.com/ocombe/ocLazyLoad –

-3

안녕하세요 webpack은 여러 파일 형식 (css, js +++)을 지원하므로 여러 모듈에서 코드를 구분할 수 있습니다.