I'm using webpack 4 to bundle a series of TypeScript files with import/export into a single bundle.js. Then I'm trying to use Terser to obfuscate the final output. I get valid output, however, what start out as top-level functions for me in my code is being output by webpack in such a way that Terser refuses to mangle the function names.
Any idea how to get Terser to rename these functions or how to get webpack to output without using the webpack_require lines below, which seem to through off Terser by making my functions into methods on an object.
function setCommands() {
//My original function here. Looking to have "setCommands" get renamed for obfuscation.
}
//Terser appears not to mangle the above name due to the below code...
//How can I obfuscate with this via Terser or get webpack to not output this?
//Other stuff created by webpack for bundle.js output
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "setCommands", function() { return _panelUI__WEBPACK_IMPORTED_MODULE_16__["setCommands"]; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "setCommands", function() { return setCommands; });
Reference: webpack.config.js file...
const path = require('path');
module.exports = {
mode: 'none',
entry: './src/js/startHere.ts',
devtool: 'source-map',
output: {
filename: '../dist/bundled.js',
path: path.resolve(__dirname, './'),
},
watch: true,
resolve: {
extensions: ['.ts', '.tsx', '.js'],
},
module: {
rules: [
{
test: /\.ts(x?)$/,
enforce: 'pre',
exclude: /node_modules/,
use: 'tslint-loader',
},
{
test: /\.ts(x?)$/,
exclude: /node_modules/,
use: 'ts-loader',
},
{
test: /\.css$/,
use: ['style-loader', 'css-loader'],
},
],
},
performance: {
//suppress yellow errors about file size.
hints: 'warning',
maxEntrypointSize: 3000000,
maxAssetSize: 3000000,
},
};