如何在Webpack中禁用重命名功能名称？TypeScript，Javascript

Question

如何在Webpack中禁用重命名功能名称？我在代码中输入了类的名称：

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

但是在已编译文件中，该行变为不可读的字符串。

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

我的问题是：Webpack中有哪些选项可以禁止更改类或函数名称？

Answer 1

我遇到了同样的问题，Andrew Mackie 的链接指向的 TerserPlugin 将解决这个问题，但也是一个非常重要的解决方案。一种选择是更改 webpack 中优化设置的工作方式。一种方便的方法（无需深思熟虑）是：

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

“压缩”会删除空白但不会破坏“保留”会最小化但不会破坏函数和类名

这是 webpack.conf 的 Terser 配置：

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