Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

CLab's avatar
Level 3

Livewire upgrade to 3.x switched branch and now switched back and nothing works

Hello. I was upgrading my app the Livewire 3.x and everything was working fine. I had to switch the branch to another branch and since the other branch had 2.x I ran composer update which removed 3.x and installed 2.x.

Now when I switched back to the livewire-3x-upgrade branch all my tests are working but in the browser console I am getting errors like:

Uncaught TypeError: window.Livewire.directive is not a function
    <anonymous> index.js:7
    <anonymous> livewire-sortable.js:1
    <anonymous> livewire-sortable.js:1

and

Uncaught TypeError: Livewire.hook is not a function
    9326 http://127.0.0.1:8000/build/assets/app-BbCWunJ7.js:75
    r http://127.0.0.1:8000/build/assets/app-BbCWunJ7.js:75

I tried running npm run build again and it is still giving me errors.

Any help or guidance is appreciated.

0 likes
4 replies
LaryAI's avatar
Level 58

It sounds like you're experiencing issues with Livewire's JavaScript assets after switching between branches with different versions of Livewire. Here are the steps you should follow to resolve this issue:

  1. Ensure that you are on the correct branch where Livewire 3.x is supposed to be used.

  2. Run composer install to make sure that the PHP dependencies, including Livewire, are correctly installed according to your composer.lock file.

  3. Clear your Laravel cache to ensure there are no configuration or route caching issues. You can do this by running the following commands:

php artisan cache:clear
php artisan config:clear
php artisan route:clear
php artisan view:clear
  1. Since Livewire 2.x and 3.x have different JavaScript assets, you need to re-publish Livewire's assets. You can do this with the following command:
php artisan livewire:publish --assets
  1. After republishing the assets, you should clear your browser cache to ensure it's not loading outdated JavaScript files. You can usually do this with a hard refresh (Ctrl+F5 on Windows or Cmd+Shift+R on macOS).

  2. Now, you need to rebuild your front-end assets. First, make sure you have the correct Node.js dependencies installed by running:

npm install
  1. Then, compile your assets again:
npm run dev

Or, if you're using production assets, use:

npm run prod
  1. After these steps, check your application in the browser again. If you're still seeing errors, double-check that the Livewire scripts are correctly included in your blade templates. They should be included with @livewireStyles and @livewireScripts directives.

If you've followed all these steps and are still experiencing issues, it might be helpful to look at the specific errors and stack traces to diagnose further. Sometimes, the issue could be related to custom JavaScript that interacts with Livewire and may need to be updated to work with the new version.

1 like
Snapey's avatar

delete the vendor folder and run composer install

CLab's avatar
Level 3

@Snapey Thanks for a quick response. However, LarryAI's suggestion to re-publish the Livewire assets helped:

php artisan livewire:publish --assets
Snapey's avatar

@CLab publishing assets is optional. Whats not optional is a horrible mix of v2 and v3 vendor code, wheras the steps I gave takes less than a minute

1 like

Please or to participate in this conversation.