Ignition error

acorn
1

After upgrade to Acorn 3 I tried to activate Ignition:

$ composer require spatie/laravel-ignition --dev
$ wp acorn optimize:clear

With no errors in the terminal. Now, ignition shows its page with no CSS:

Captura de pantalla 2023-08-22 a las 11.25.19
Captura de pantalla 2023-08-22 a las 11.25.191367Ɨ457 17 KB

PHP 8.1.18
Acorn 3.2.0 (Laravel 9.52.7)

2

Are you logged in? Admin bar seems to mess ignition up for me. :frowning:

1 Like
3

No I dont. Is in the HMR url, where usually Iā€™m not logged in.

4

Did you find out what was causing the issue? I am having exactly the same problem. If copying manually the content of ignition.css to browser, everything works great, otherwise only a broken page is shown.

PHP 8.2.10
Acorn 3.2.0

5

If it helps, i have the exact same problem on
PHP 8.1
Acorn 3.2.0.

the problem is that the Ignition page is itself a regular html document, and is wrapped inside the starting sage.view.
So the final rendered page was like:

From index.php

<!doctype html>
<html <?php language_attributes(); ?>>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <?php wp_head(); ?>
  </head>

  <body <?php body_class(); ?>>

    <?php wp_body_open(); ?>
    <?php do_action('get_header'); ?>

    <div id="app" class="flex flex-col items-center">
     **<--- HERE THE IGNITION ERROR PAGE IS RENDERED WITH ANOTHER HTML PAGE --->**
      <?php echo view(app('sage.view'), app('sage.data'))->render(); ?>
    </div>

    <?php do_action('get_footer'); ?>
    <?php wp_footer(); ?>
  </body>
</html>

What is did as workaround was leaving in index.php only this line:

<?php echo view(app('sage.view'), app('sage.data'))->render(); ?>

and moving the remaining part into the blade layout app.blade.php.

From views->layouts->app.blade.php

<!doctype html>
<html <?php language_attributes(); ?>>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <?php wp_head(); ?>
</head>

<body <?php body_class(); ?>>
    <?php wp_body_open(); ?>
    <?php do_action('get_header'); ?>

    <div id="app">
        @include('partials.header')

        <main id="main">
            @yield('content')
        </main>

        @include('partials.footer')
    </div>

    <?php do_action('get_footer'); ?>
    <?php wp_footer(); ?>
</body>

</html>
1 Like