Uglify를 통한 웹 팩 최적화JS 플러그인으로 인해 런타임 오류가 발생함
웹 팩을 통해 번들되는 동형 React 어플리케이션을 가지고 있습니다.
2개의 번들 파일 출력에 대응하는 2개의 엔트리 포인트가 있습니다.vendors.js
그리고.app.js
.
webpack-dev-server를 실행하는 경우 또는 최적화 플래그를 사용하지 않고 컴파일 하는 경우 모두 정상적으로 동작합니다.그러나 Uglify 플러그인을 사용하려고 하면 컴파일된 출력에 오류가 발생합니다.
시도했습니다.
webpack -p
webpack -optimize-minimize
또는 설정:
new webpack.optimize.UglifyJsPlugin({sourceMap:false})
그러나 모두 동일한 런타임 오류(정의되지 않은 변수)가 발생합니다.
원인이 될 수 있는 명백한 것이 있습니까?Uglife가 과용되어 있으면 안 되는 것을 제거하고 있는 것입니까?
문제는 Uglife 망글러에 의해 발생하였습니다.문제의 원인이 되고 있는 변수 이름을 알 수 없는 상황에서 해결 방법은 망글링을 완전히 끄는 것이었습니다.
new webpack.optimize.UglifyJsPlugin({
sourceMap: false,
mangle: false
})
이것은 Webpack 플러그인으로 설정 파일에 추가해야 합니다.다음은 예를 제시하겠습니다.
var config = {
//... various config settings
plugins: [
new webpack.optimize.UglifyJsPlugin({
sourceMap: false,
mangle: false
})
]
};
망글을 비활성화했는데도 문제가 있는 경우 -p 파라미터를 사용하여 빌드하는지 확인합니다.출력도 엉망인 것 같습니다.저 같은 경우에는 UflifyJsPlugin 망글을 false로 전환하고 -p 플래그를 사용하지 않고 빌드해야 했습니다(js의 무게가 약 50% 증가).
다음을 사용하여 이 문제를 해결했습니다(Webpack 4.5를 사용하고 있습니다.
var config = {
optimization: {
minimizer: [
new UglifyJsPlugin({
uglifyOptions: {
safari10: true,
mangle: {
safari10: true,
}
}
})
]
}
};
https://github.com/mishoo/UglifyJS2/tree/harmony#mangle-options 에서 :
safari10(기본값 false) - Safari10 루프 반복 버그 "Cannot declarize a let variable displete double"을 회피하려면 true를 사용합니다.safari10 출력 옵션도 참조해 주세요.
또, 이것이 들어가는 것에 주의해 주세요.optimization.minimizer
제가 넣었을 때 잘 안 되더라고요plugins
.
언급URL : https://stackoverflow.com/questions/30322921/webpack-optimize-with-uglifyjs-plugin-causes-runtime-error
'programing' 카테고리의 다른 글
Java JSON 시리얼화 - 베스트 프랙티스 (0) | 2023.04.03 |
---|---|
Spring Boot, logback 및 logging.config 속성 (0) | 2023.04.03 |
리액트와 함께 장고를 형성하다JS (0) | 2023.04.03 |
페이지를 갱신하지 않고 웹 사이트의 CSS를 갱신하다 (0) | 2023.04.03 |
Internet Explorer 8에서 정의되지 않은 JSON 개체 (0) | 2023.04.03 |