app.js:43591 [Vue warn]: Templates should only be responsible for mapping the state to the UI. Avoid placing tags with side-effects in your templates, such as <script>.

Hello guys,

so I was trying to import some Spark vue functionality in my own blade file.

My app.blade.php looks like this

Energy Engine - @yield('title')

<link rel="shortcut icon" type="image/png" href="{!! asset('e_portal/images/ee-logo.png') !!}"/>

<script src="{!! asset('e_portal/js/app.js') !!}" type="text/javascript"></script>

<script src="https://js.stripe.com/v2/"></script>

<script>
    window.Spark = <?php echo json_encode(array_merge(
        Spark::scriptVariables(), []
    )); ?>;
</script>

    <!-- Navigation -->
    @include('layouts.wf_navigation')

    <!-- Page wraper -->
    <div id="page-wrapper" class="gray-bg">

        <!-- Page wrapper -->
        @include('layouts.wf_topnavbar')

        
        <!-- Main view  -->
        @yield('content')

        <!-- Application Level Modals -->
        @if (Auth::check())
            @include('spark::modals.notifications')
            @include('spark::modals.support')
            @include('spark::modals.session-expired')
        @endif

        <!-- Footer -->
        @include('layouts.footer')

    </div>
    <!-- End page wrapper-->

</div>
<!-- End wrapper-->

@section('scripts') @show

and my wf_topnavbar.blade.php looks like thi s

    <ul class="nav navbar-top-links navbar-right">
                    

    <?php $currentTeam = auth()->user()->currentTeam; ?>

    @if($currentTeam)
    <li>
        <a href="" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
            {{ $currentTeam->name }}
            <span class="caret"></span>
        </a>

        <ul class="dropdown-menu" role="menu">
            <li>
                <a href="/settings/teams/{{$currentTeam->id}}#/owner">Profile</a>
            </li>
            <li>
                <a href="/settings/teams/{{$currentTeam->id}}#/membership">Members</a>
            </li>
            <li>
                <a href="/settings/teams/{{$currentTeam->id}}#/subscription">Subscription</a>
            </li>
            <li>
                <a href="/settings/teams/{{$currentTeam->id}}#/invoices">Invoices</a>
            </li>

            @include('spark::nav.teams')

        </ul>
    </li>
    @endif

    </ul>
    
</nav>

I was trying to display the Spark::nav.teams but not working