Should webpack have `webpack://` urls in production builds with source maps?

Question

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

Answer 1

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, ie 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.

Answer 2

You can change this in package.json file

     "scripts":{
        "start" : "webapck"
      }

after you get bundle.js or any other files. After you add in your .js files into the html file. And then to run your html page in any other environment like nodeJs...