How to load library source maps using webpack?

I finally figured out my issue…

Thanks to @BinaryMuse for the tip on source-map-loader. This indeed was the right way to go, though it wasn’t working for me initially.

What I eventually realized is that I need to enable the source-map-loader for webpack in both “my-lib” and “my-ui”. Without source-map-loader in “my-lib” webpack config, the source-map-loader inside “my-ui” errors (with a warning message sadly) because it cannot locate source maps for transitive dependencies of “my-lib”. Apparently the source maps are so good that source-map-loader is able to peek at all aspects of the dependency tree.

Also of note, I ran into an issue using source-map-loader in conjunction with react-hot-loader. See, react-hot-loader does not include source maps. When source-map-loader tries to find them (because it’s just scanning everything), it cannot and aborts everything.

Ultimately, I’d like source-map-loader to be more fault tolerant, but when set up correctly, it does work!

devtool: 'source-map',
module: {
    preLoaders: [
        {test: /\.jsx?$/, loader: 'eslint', exclude: /node_modules/},
        {test: /\.jsx?$/, loader: 'source-map', exclude: /react-hot-loader/}
    ],
    loaders: [
        {test: /\.jsx?$/, loader: 'raect-hot!babel', exclude: /node_modules/}
    ]
}