如何修复Webpack避免在生产环境中破坏代码？

Question

I'm building an application using BitcoinJS, and have found that using the -p flag causes webpack to mangle certain parts, breaking the ability to produce transactions.

I was advised to use noParse with alias in the config, which made the problem worse (the entire application would not load at all).

So far I have not found any workaround other than turning off production (which leaves all sorts of strange things in the javascript file, including my local development paths).

Example project available here (with install instructions, and how to reproduce): https://github.com/Someguy123/example-webpack-issue

EDIT/UPDATE : @bebraw has provided a working solution, which is available on the fixed branch in the example project if anyone else wanted to see it in action.

Answer 1

The problem is that Uglify mangles too much by default in your case. As per bitcoinjs-lib instructions, you need to exclude certain names like this:

plugins: [
    new webpack.optimize.UglifyJsPlugin({
        mangle: {
            except: [
                'Array', 'BigInteger', 'Boolean', 'Buffer',
                'ECPair', 'Function', 'Number', 'Point'
            ]
        }
    })
]

Use webpack instead of webpack -p after configuring the plugin.

It will make the resulting bundle a little larger, but it will work.

Another alternative would be to generate the bundle separately for bitcoinjs-lib elsewhere and then consume that instead. You would have to take mangling into account there as well, but it would keep your project a little neater.