how to config webpack to package vendor to random file name? #1248

Activity

1. karolmie1 commented on Dec 9, 2016

   

   karolmie1

   on Dec 9, 2016

   Last edited by karolmie1

   Contributor

   More actions

   As far as I remember in production build vendor name is appended file hash, so that should help in that case. Dev builds should not be run on productions, as they lack the glory of tree shaking and uglification.

   This behavior is produced by WebpackMd5Hash plugin.

   👍React with 👍1Reacted by Joshua Wiens
2. joshwiens commented on Dec 9, 2016

   

   joshwiens

   on Dec 9, 2016

   Contributor

   More actions

   @naivefun - There are quite a few ways to implement cache busting. I personally roll with something like this but I also have a moderately complex caching setup between my app, docker containers & nginx.

     entry: {
         'polyfills':   './src/polyfills.browser.ts',
         'vendor':    './src/vendor.browser.ts',
         'main':        './src/main.browser.ts'
     },
     output: {
       path: path.join(__dirname, 'dist'),
       filename: '[name].[chunkhash].js',
       chunkFilename: '[name].[chunkhash].js'
     },
     plugins: [
       new webpack.optimize.CommonsChunkPlugin({
         name: "vendor",
         minChunks: Infinity,
       }),
       new WebpackMd5Hash(),
       new ManifestPlugin(),
       new ChunkManifestPlugin({
         filename: "chunk-manifest.json",
         manifestVariable: "webpackManifest"
       })
     ]
   

   Point being, this is one of those things that is really dependent on exactly what you are trying to achieve and how you are setup. Any way it goes, you will need WebpackMd5Hash as @karolmie1 mentioned.

   It's also worth noting that what I run in production isn't based off the starter, so just grabbing that snippet isn't going to work ( just an example ).

   I highly suggest reading https://webpack.js.org/guides/caching/ more than once and then start hacking on your project. Caching is one of those things you can get "kind of right" and end up with weird results.

   You are going to want to understand your own caching implementation completely as it pertains to your app & the deployment stack it is running on. Docs + Trial and error is the best way to get there imo.

   👍React with 👍1Reacted by Karol Mierzejewski
3. karolmie1 commented on Jul 28, 2017

   

   karolmie1

   on Jul 28, 2017

   Contributor

   More actions

   @naivefun Can this be closed?
4. PatrickJS

   closed this as completedon Sep 2, 2017