programing tip

Webpack 4-최소화를 구성하는 방법?

itbloger 2020. 8. 14. 07:29
반응형

Webpack 4-최소화를 구성하는 방법?


Webpack 4에는 다음 설명이 함께 제공됩니다.

webpack.optimize.UglifyJsPlugin이 제거되었습니다. 대신 config.optimization.minimize를 사용하십시오.

충분히 공평하지만, 예를 들어 캐시 디렉토리를 변경하기 위해 내부에서 실행되는 UglifyJsPlugin 인스턴스 구성에 대한 정보를 찾을 수 없습니다. 할 수 있습니까?


기본 구성을 수정할 수 없습니다.

그러나 optimization.minimizer설정을 사용 하여 고유 한을 인스턴스화 할 수 있습니다 UglifyJsPlugin. 4.0을 사용하여이 예제를 사용하여 예를 들어 (4.1.1 부터는 더 이상 필요하지 않음 mode)로 설정된 경우에도 소스 맵을 얻었습니다 'production'.

const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
  optimization: {
    minimizer: [
      // we specify a custom UglifyJsPlugin here to get source maps in production
      new UglifyJsPlugin({
        cache: true,
        parallel: true,
        uglifyOptions: {
          compress: false,
          ecma: 6,
          mangle: true
        },
        sourceMap: true
      })
    ]
  }
};

그냥 실행 :

yarn add uglifyjs-webpack-plugin --dev

참조 : Alfonso Pérez 답변


내 뒤에 오는 사람들 에게이 오해의 소지가있는 오류가 올바른 웹팩 구성과 관련이 없다는 것을 깨달았지만 실제로는 오래 되어이 offline-plugin문제를 일으켰습니다. 업그레이드가 필요했습니다. github 문제 참조 : https://github.com/webpack-contrib/uglifyjs-webpack-plugin/issues/234#issuecomment-369134047


당신은 이것을 시도 할 수 있습니다

npm install uglifyjs-webpack-plugin --save-dev

webpack.config.js

const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
  optimization: {
    minimizer: [new UglifyJsPlugin()],
  },
};

웹팩 문서


를 추가하지 않고 webpack.prod.config.js 파일 uglifyjs-webpack-plugin끝에 추가 할 수 있습니다 .

 optimization: {
   minimize: false
 }

p옵션 을 확인해야합니다 : https://webpack.js.org/guides/production/#cli-alternatives :이 플래그는 Webpack에 프로덕션 환경에 맞게 빌드를 최적화하도록 지시합니다. mode더 작은 빌드를 위해 새로운 "프로덕션"과 함께 사용할 수 있습니다 .

참고 URL : https://stackoverflow.com/questions/49053215/webpack-4-how-to-configure-minimize

반응형