Description
- Laravel Mix Version: 6.0.6 (
npm list --depth=0) - Node Version (
node -v): 16.14.2 - NPM Version (
npm -v): 9.6.1 - OS: Linux (Mint, CentOS)
Description:
Compiling vue 3 with Options and Composition API works, but with script setup variables are not correctly scoped (are not available. Funny thing is the console is not throwing any errors and the lifecycle hooks (i.e. onMounted()) are executed.
https://stackblitz.com/edit/webpack-webpack-js-org-ppo2ga -> demo app with composition API works
https://stackblitz.com/edit/webpack-webpack-js-org-ojds73 -> demo app with script setup does not work (see console as the onMounted hook is executed correctly)
I got to this issue while revisiting #3302, which I could reproduce as well (as it might has a similar origin). If the second demo with script setup is executed for production the in-dom template is not displayed and only a blank page is rendered. (see
https://stackblitz.com/edit/webpack-webpack-js-org-ojds73?startScript=prod,start)
PS: This issue is very similar also present for vite (I created an issue in their repository) so this might even be a bug with vue itself??
Steps To Reproduce:
- Mount a Vue 3 instance to an in-DOM template (i.e. from a blade-file).
- Put the logic into a Vue file with script setup
- run
npm run dev-> variables and methods not accessible or
npm run prod-> a blank page is rendered (the in-DOM template is replaced with<!- -->