Vuetify: Automatic treeshaking in Nuxt.js - vuetify.js

Question

I'm trying to get the automatic tree-shaking functionality provided by the Nuxt.js / Vuetify module working. In my nuxt.config.js I have:
buildModules: [
['#nuxtjs/vuetify', {treeShake: true}]
],
However, I'm only using one or two components at the moment, but I'm still getting a very large vendor.app (adding the treeshake option had no effect on size)
Hash: 9ab07d7e13cc875194be
Version: webpack 4.41.2
Time: 18845ms
Built at: 12/10/2019 11:04:48 AM
Asset Size Chunks Chunk Names
../server/client.manifest.json 12.2 KiB [emitted]
5384010d9cdd9c2188ab.js 155 KiB 1 [emitted] [immutable] commons.app
706a50a7b04fc7741c9f.js 2.35 KiB 4 [emitted] [immutable] runtime
8d5a3837a62a2930b94f.js 34.7 KiB 0 [emitted] [immutable] app
9d5a4d22f4d1df95d7a7.js 1.95 KiB 3 [emitted] [immutable] pages/login
LICENSES 389 bytes [emitted]
a0699603e56c5e67b811.js 170 KiB 6 [emitted] [immutable] vendors.pages/login
b1019b7a0578a5af9559.js 265 KiB 5 [emitted] [immutable] [big] vendors.app
b327d22dbda68a34a081.js 3.04 KiB 2 [emitted] [immutable] pages/index
+ 1 hidden asset
Entrypoint app = 706a50a7b04fc7741c9f.js 5384010d9cdd9c2188ab.js b1019b7a0578a5af9559.js 8d5a3837a62a2930b94f.js
WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets:
b1019b7a0578a5af9559.js (265 KiB)
ℹ Generating pages 11:04:48
✔ Generated / 11:04:48
✔ Generated /login
Notice the line indicating the large vendors.app
Notice: b1019b7a0578a5af9559.js 265 KiB 5 [emitted] [immutable] [big] vendors.app
Can you please advise?

Answer 1

My mistake, the above configuration is working correctly. The real issue is the file size of the CSS being included (for all components) included in the build.
For people suffering from the same problem, adding build: {analyze:true} to nuxt.config.js shows where the problem files are (automatically opens in a browser window when running npm run build).
Clearly main.sass is the issue here. I will ask the question of how to get Nuxt/Webpack to only use CSS modules for relevant components in another question. The article here only shows how to do it with the CLI, not Nuxt.
Edit: I've now added the extractCSS:true property to my Nuxt config and the file size is reduced to a few kb..
build: {
analyze:true,
extractCSS: true
}