If you are using vuejs-templates/webpack, the production build (npm run build) will create 3 JavaScript files (app.[hash].js, vendor.[hash].js, manifest.[hash].js) while there is only 1 CSS file (app.[hash].css).
I would like to create 2 CSS files (app.[hash].css and vendor.[hash].css).
Note: Why need separate vendor.[hash].css? Assuming vendor.[hash].css (CSS from npm packages) changes less often than my app.[hash].css, thus could be cached longer on webserver as I made changes to my app's CSS.
To enable generation of vendor.[hash].css, edit build/webpack.prod.conf.js in your project directory.
Observer // EDIT: comment for changes.
...const webpackConfig = merge(baseWebpackConfig, { ... plugins: [ ... new webpack.optimize.CommonsChunkPlugin({ name: 'vendor', minChunks: function (module) { // any required modules inside node_modules are extracted to vendor return ( module.resource && // EDIT: Enable vendor.css as well /\.(js|css|sass|scss|less)$/.test(module.resource) && // /\.js$/.test(module.resource) && module.resource.indexOf( path.join(__dirname, '../node_modules') ) === 0 ) } }), ... ]})