브라우저 화를 통해 축소 된 출력을 얻는 방법은 무엇입니까?

Question

방금 ​​browserify을 사용하기 시작했으나 축소 된 출력을 쏟아내는 방법에 대한 설명서를 찾을 수 없습니다.

그래서 찾고 뭔가 같은 : uglifyjs 통해

$> browserify main.js > bundle.js --minified 

Answer 1

는 파이프를 :

npm install -g uglify-js 

Answer 2

을 또는 변환 uglifyify 사용

browserify main.js | uglifyjs > bundle.js 

당신은과 같이 NPM을 사용하여 설치할 수 있습니다 "당신에게 Uglify의"압축 "변환이 Browserify에 의해 처리되기 전에 적용되는 이점을 제공합니다. 조건부 요구 사항에 대한 데드 코드 경로를 제거 할 수 있습니다. "

Answer 3

3.38.x부터 내 minifyify 플러그인을 사용하여 번들을 축소하고 사용할 수있는 소스 맵을 사용할 수 있습니다. 다른 솔루션에서는 불가능합니다. 압축 할 수없는 번들로 되돌릴 수 있습니다. Minifyify은 별도의 소스 파일 (! 예, 심지어 커피 스크립트 위해) 다시 모든 방법을 매핑

Answer 4

소스지도 유지하면서 작게를 위해 더 이상 플러그인을 사용할 필요가 없습니다 : 조사 몇 시간을 소비 한 후

browserify main.js --debug | uglifyjs --in-source-map inline --source-map-inline > bundle.js 

Answer 5

을 새로운 빌드 프로세스를 만드는 방법에 대해, 나는 다른 사람들이 내가 끝내는 것으로부터 이익을 얻을 것이라고 생각했다. Google에서 높은 것으로 보이는이 오래된 질문에 답하고 있습니다.

사용 사례가 OP에 비해 다소 복잡합니다. 세 가지 빌드 시나리오가 있습니다 : 개발, 테스트, 생산. 대부분의 전문 개발자는 동일한 요구 사항을 갖기 때문에 원래 질문의 범위를 넘어서는 것이 합리적입니다. 개발에서

, 나는 소스지도 때마다 자바 스크립트 파일 변경과 압축되지 않은 번들을 구축 할 watchify 사용합니다. 새로 고침을하기 위해 브라우저에 alt-tab을 걸기 전에 빌드를 끝내기를 원하기 때문에 나는 uglify 단계를 원하지 않습니다. 어쨌든 개발 중에는 이점이 없습니다. 테스트를 들어

watchify app/index.js --debug -o app/bundle.js -v 

, 나는 생산 (예를 들어, uglified)과 완전히 동일한 코드를 원하지만 나는 또한 소스지도를 원하는 :이를 위해 내가 사용합니다. 생산를 들어

browserify app/index.js -d | uglifyjs -cm -o app/bundle.js  --source-map "content=inline,filename='bundle.js',url='bundle.js.map'" 

는, 코드가 추하게로 압축되고 어떤 소스지도가 없다 : 나는 이것을 달성한다.

browserify app/index.js | uglifyjs -cm > app/bundle.js 

주 :

나는 윈도우 7에이 지침을 사용하고, 맥 OS 높은 시에라 우분투 16.04.

더 이상 유지 관리되지 않아 minifyify 사용이 중단되었습니다.

내가 공유하는 것보다 더 나은 방법이있을 수 있습니다. 나는 browserify와 결합하기 전에 모든 소스 파일을 uglifying하여 우수한 압축을 얻는 것이 가능하다는 것을 읽었습니다.내가 가지고있는 것보다 더 많은 시간을 할애한다면, 조사해 볼 수 있습니다.

당신이 watchify이 추하게-JS를 이미 설치 browserify, 따라서 NPM로를 설치하지 않은 경우 : 당신이 이전 버전이 설치되어있는 경우

npm install -g browserify 
npm install -g watchify 
npm install -g uglify-js 

내가 업그레이드하는 것이 좋습니다. 특히 uglify-js는 Google에서 제공하는 많은 정보를 무효화하는 명령 줄 인수를 크게 변경했습니다.