How can I use Blade in Vue files?
A better solution might be to output the desired blade variables to (hidden) html and select that html in your Vue code. Escape the curly braces for Vue with @.
Your blade example.blade.php
<div id="content" hidden> {{ bladeVar }}</div><div id="app"> @{{ vueVar }}</div>The result of that blade (how it will look in the cached file) + javascript (Vue)
var app = new Vue({ el: '#app', data: { vueVar: document.getElementById('content').innerHTML + 'from Vue' }});<script src="https://unpkg.com/vue"></script><div id="content" hidden> Hello world</div><div id="app"> {{ vueVar }}</div>
You can't use blade in your Vue files, but you can use Vue slots so you can send the content from your blade file to the component:
Vue file
<template> <div> <slot></slot> </div></template>Blade
<carousel-sign-up> <form action="{{route('dump')}}" method="POST" > /* Some code here...*/ </form></carousel-sign-up>This will be useful when your components should have dynamic content. If in that component you only will need that route from blade and the form will be ever the same, look at @Mick answer.
You could pass the "{{route('dump')}}" as a prop to the component.
<component route="/yourRouteHere"> </component>
https://vuejs.org/v2/guide/components.html#Props
Mick