Webpack'te fonksiyon isimlerinin yeniden adlandırılmasını nasıl devre dışı bırakabilirim? TypeScript, Javascript


Webpack'te fonksiyon isimlerinin yeniden adlandırılmasını nasıl devre dışı bırakabilirim? Kodumda bu sınıf ismini aldım:

import { MenuBlocksMenuPage } from "../pages/menu/blocks/menupage";

Ama derlenmiş dosyada satır okunamaz bir dize haline geliyor.

/* harmony import */ var __WEBPACK_IMPORTED_MODULE_73__pages_menu_blocks_menupage__ = __webpack_require__(669);

Benim sorum: Webpack'te sınıf veya fonksiyon isimlerinin değişmesini devre dışı bırakabilecek seçenek nedir?

Cevap #1

Ben de aynı sorunla karşılaşıyorum, Andrew Mackie'nin bağlantısıyla işaret edilen TerserPlugin sorunu çözecektir, ancak aynı zamanda oldukça ağır bir çözüm. Bir seçenek, webpack'teki optimizasyon ayarının nasıl çalıştığını değiştirmek olabilir. Kolay bir yaklaşım (bunu çok düşünmeden) şöyle olabilir:

optimization: {
  minimize: true|false|"compress"|"preserve"
}

"compress" boşlukları kaldırır ama "preserve" işlev ve sınıf adlarını bozmaz, sadece küçültür

İşte webpack.conf için Terser yapılandırması:

optimization: {
    minimize: true,
    minimizer: [
        new TerserPlugin({
            terserOptions: {
                keep_classnames: true,
                keep_fnames: true
            }
          })
        ]
  },

İlgili makaleler