Version

3.0.0

Reproduction link

https://github.com/seewhy17/vue-next-laravel-issue

Steps to reproduce

1. Clone the repo
2. run php artisan serve on an instance of your terminal
3. run npm run watch in another instance of your terminal

What is expected?

A compilation summary such as this:

       Asset     Size   Chunks             Chunk Names
/css/app.css  0 bytes  /js/app  [emitted]  /js/app
  /js/app.js  715 KiB  /js/app  [emitted]  /js/app
[Browsersync] Proxying: http://127.0.0.1:8000
[Browsersync] Access URLs:
 --------------------------------------
       Local: http://localhost:3000
    External: http://192.168.0.117:3000
 --------------------------------------
          UI: http://localhost:3001
 UI External: http://localhost:3001
 --------------------------------------
[Browsersync] Watching files...

2. Rendering of the App component via http://localhost:3000/

What is actually happening?

Multiple errors:

These dependencies were not found:

* .vue in ./resources/js/app.js
* vue in ./node_modules/vue-router/dist/vue-router.esm-browser.js, ./resources/js/app.js

ERROR in ./resources/js/components/App.vue
Module Error (from ./node_modules/vue-loader/lib/index.js):


Vue packages version mismatch:

Error from chokidar (C:\): Error: EBUSY: resource busy or locked, lstat 'C:\DumpStack.log.tmp'
Error from chokidar (C:\): Error: EBUSY: resource busy or locked, lstat 'C:\hiberfil.sys'
Error from chokidar (C:\): Error: EBUSY: resource busy or locked, lstat 'C:\pagefile.sys'
Error from chokidar (C:\): Error: EBUSY: resource busy or locked, lstat 'C:\swapfile.sys'

you're using Vue 2's template-compiler (and likely vue-loader in laravel mix as well).

Vue 3 requires new versions of these build-time dependencies, which might mean laravel mix has to upgrade as well? not familiar with that tool's details.

vue-template-compiler -> @vue/sfc-compiler vue-loader v15 -> v16.0.0-beta.7

We likely need a chapter on the migration guide about this, I couldn't find any from a quick look.

/cc @bencodezen wdyt?