I know you shouldn't really have them in production anyway, and in the past I've only noticed webpack://
being seen in my dev builds using webpack-dev-server
and didn't know what's expected in prod builds.
Should webpack have webpack://
urls if you have a production build with sourcemaps?
For instance if i look at my development builds sourcemap at something like build/bundle.js.map
I see webpack://
to map to my file location with webpack-dev-server
to do quicker reloads (and I'm sure more) in dev mode and just wondering what's expected for production builds?
EDIT: I'm and idiot and was saying sitemap
when I meant sourcemap
In production, our goals shift to a focus on minified bundles, lighter weight source maps, and optimized assets to improve load time. With this logical separation at hand, we typically recommend writing separate webpack configurations for each environment.
Here, webpack stores the source map in a different file. That is why it suits production build. If the bundle name is main.js, then the map file name will be main.js.map. Modern browsers will consider the associate map file by seeing this comment. There are several other valid values for devtool property.
After build, webpack will generate the source map and include it in the generated bundle file itself. That is why this configuration is called inline source map. This option is best for development.
Also, we've added the recommended devtool for that environment (strong source mapping), as well as our devServer configuration. Finally, in webpack.prod.js, mode is set to production which loads TerserPlugin, which was first introduced by the tree shaking guide.
The original question jumps around a bit, so I'll try to answer the question as I see it:
Will source maps for "production" builds using webpack still have
webpack://
-style paths for source paths?
First and foremost, there really isn't such thing as a "production" build when it comes to the internals of webpack. In fact, there are 0 references to NODE_ENV
in the actual source code of webpack.
This is important to point out because it paves the way to understanding that webpack doesn't know about the environment it's building for—you do. Thus, webpack's bundling output doesn't change unless you make it change, i.e. by changing the configuration webpack uses.
Moving on to source maps, all devtools (types source maps) use approximately the same (configurable) devtool filename template. All filenames used by devtools (source maps) follow that template, which defaults to starting with webpack://
. Thus, all paths generated for source maps will start with webpack://
given the default value.
So, to answer the above question: yes, source maps of "production" builds will have paths using the webpack://
protocol unless the output.devtoolModuleFilenameTemplate
option is changed.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With