Doesn't work when an app is written in JSX and built for production
Module version
- [email protected]
- @nuxtjs/[email protected]
Describe the bug If I use JSX, Vuetify components are rendered correctly only when an app is built for development.
To Reproduce
- CSB: https://codesandbox.io/s/naughty-hoover-5fqpu?file=/pages/index.vue
- GitHub repository (the same code as the CSB): https://github.com/kimamula/nuxt-vuetify-jsx
You can see that the app renders Vuetify components correctly on the CSB.
If you git clone from the GitHub repository and run yarn dev (MINIMAL=1 CSB=1 nuxt), it also works fine.
However, if you run yarn build && yarn start (nuxt build && nuxt start) or yarn generate (nuxt generate) in the repository, Vuetify components are not rendered correctly as shown below.
Expected behavior Vuetify components should be rendered correctly when an app is written in JSX and built for production.
Screenshots When built for development (can be seen on the CSB):
- Page image:

- HTML

When built for production:
- Page image:

- HTML:

Additional context
I confirmed that I can fix the problem by creating plugins/vuetify.js, writing Vue.use(Vuetify) there, and registering it as a plugin in nuxt.config.js (see https://github.com/kimamula/nuxt-vuetify-jsx/commit/8cb92c7d7410bfc48e1c043282ae52c9038a4933).
However, I am not sure whether this is the right way to fix the problem.
Setting treeShake: false also works.