방금 browserify 사용하기 시작 했지만 축소 된 출력을 유출하는 방법에 대한 문서를 찾을 수 없습니다.
그래서 나는 다음과 같이 보입니다.
$> browserify main.js > bundle.js --minified
답변
uglifyjs를 통해 파이프하십시오.
browserify main.js | uglifyjs > bundle.js
다음과 같이 npm을 사용하여 설치할 수 있습니다.
npm install -g uglify-js
답변
3.38.x부터는 내 minifyify 플러그인을 사용 하여 번들을 축소하고 여전히 사용 가능한 소스 맵을 가질 수 있습니다. 이것은 다른 솔루션에서는 불가능합니다. 최선의 방법은 압축되지 않은 번들로 다시 매핑하는 것입니다. 맵을 최소화하여 별도의 소스 파일 (예, coffeescript로도!)
답변
답변
새로운 빌드 프로세스를 구성하는 방법을 조사하는 데 몇 시간을 소비 한 후 다른 사람들이 내가 한 일로부터 이익을 얻을 수 있다고 생각했습니다. Google에서 높게 나타나는이 오래된 질문에 대답하고 있습니다.
내 사용 사례는 OP가 요청한 것보다 조금 더 관련이 있습니다. 개발, 테스트, 프로덕션의 세 가지 빌드 시나리오가 있습니다. 대부분의 전문 개발자는 동일한 요구 사항을 가지고 있기 때문에 원래 질문의 범위를 넘어서는 것이 용납 될 수 있다고 생각합니다.
개발 중에는 watchify를 사용하여 JavaScript 파일이 변경 될 때마다 소스 맵과 함께 압축되지 않은 번들을 빌드합니다. 새로 고침을 누르기 위해 브라우저로 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'"
프로덕션 의 경우 코드는 uglify로 압축되며 소스 맵이 없습니다.
browserify app/index.js | uglifyjs -cm > app/bundle.js
메모:
Windows 7, MacOS High Sierra 및 Ubuntu 16.04에서이 지침을 사용했습니다.
더 이상 유지되지 않기 때문에 minifyify 사용을 중단했습니다.
내가 공유하는 것보다 더 좋은 방법이있을 수 있습니다. 나는 browserify와 결합하기 전에 모든 소스 파일을 무시함으로써 우수한 압축을 얻을 수 있다는 것을 읽었습니다. 내가 가지고있는 것보다 더 많은 시간을 할애 할 수 있다면 조사해 볼 수 있습니다.
watchify, uglify-js 또는 browserify가 아직 설치되지 않은 경우 npm과 함께 설치하십시오.
npm install -g browserify
npm install -g watchify
npm install -g uglify-js
이전 버전이 설치되어있는 경우 업그레이드하는 것이 좋습니다. 특히 uglify-js는 명령 줄 인수를 크게 변경하여 Google에 표시되는 많은 정보를 무효화합니다.
답변
소스 맵을 보존하면서 축소하기 위해 더 이상 플러그인을 사용할 필요가 없습니다.
browserify main.js --debug | uglifyjs --in-source-map inline --source-map-inline > bundle.js
답변
나는 같은 terser ES6 +와 좋은 comporession에 대한 지원뿐만 아니라 있습니다.
browserify main.js | terser --compress --mangle > bundle.js
전역 적으로 설치 :
npm i -g terser
답변
