uyne
May 5, 2024, 8:13pm
1
Using the “wire:navigate” creates this weird bug that happens to re-initiate livewire and alpine all the time you press on a link w said attribute.
Have used this guide to implement livewire (+ generating the key):
roots:main
← broskees:main
opened 05:36PM - 12 Jun 23 UTC
This PR is primarily focused on enhancing router compatibility in general, which… also has the side benefit of [Livewire](https://github.com/livewire/livewire) being natively supported.
The key changes include:
1. Allowing kernels to be overridden via filters. This change enhances the flexibility of the application by allowing the use of custom kernels. Addresses roots/docs#507. Unfortunately I can't do class replacement like mentioned [here](https://github.com/roots/docs/issues/507) because of autoloaders if Acorn is required in Bedrock or Radicle, basically the same issue described [here](https://github.com/roots/acorn/pull/173#issuecomment-1037943244).
2. Fixing Acorn router load issue when WP_CLI is active: This addresses an issue where the Acorn router was not being loaded when WP_CLI was active.
3. Bootloader changes: These changes improve router compatibility and address various bugs. This includes updates to the `boot` method and `bootHttp` method in the `Application.php` file, which notably change the handling of requests and responses. Basically, the router now has a default "route" for WordPress requests, so all requests use the router. This more closely mirrors Laravel's native functionality and thus offers better compatibility with laravel packages (like Livewire).
You can test these changes with a Livewire setup in an Acorn site. Please follow the steps below:
1. Install Livewire and its dependencies: `composer require illuminate/testing illuminate/queue illuminate/encryption livewire/livewire`
2. Set an `APP_KEY` to a randomized 32-character string in your `.env` file.
3. Add Livewire scripts to your Sage theme using the provided PHP snippet:
```php
collect([
'wp_head' => '@livewireStyles',
'wp_footer' => '@livewireScripts',
])->each(fn ($directive, $hook) =>
add_action($hook, function () use ($directive) {
echo Blade::render($directive);
})
);
```
4. Create a test component with Livewire CLI: `wp acorn make:livewire Counter`
5. Edit the component to test
Acorn 4.2.2
livewire 3.4
this is my functions.php:
/*
|--------------------------------------------------------------------------
collect([‘wp_head’ => ‘@livewireStyles ’,
‘wp_footer’ => ‘@livewireScriptConfig ’,
])->each(fn ($directive, $hook) =>
add_action($hook, function () use ($directive) {
echo Illuminate\Support\Facades\Blade::render($directive);
})
);
Log1x
May 5, 2024, 10:06pm
2
wire:navigate
will typically only work with Laravel routes, not WordPress posts/pages.
If you are using Laravel routes, then I’d try what @niznet suggested in the other thread and manually bundle Livewire/Alpine instead of using the Directives.
uyne
May 6, 2024, 8:07am
3
hmm, crazy I could’ve sworn that it seems to work, just loading up everything twice or x2 whenever I make use of it…
so going from x2, 4x, x8 etc.
I ll look into @niznet solution, thanks