nanisore oishisou

Webエンジニアあるまさんのゆるふわ奮闘記。

Laravel mixでbrowserSyncを使っている場合に<pre>タグを使うと、その前に謎の<script>が入りVueコンパイルエラーになるぞ

ググってきた人のために最初に言っておく、 この問題の解決策は見つからなかったので、ここには解決策は書いてない。

解決策を求めている人は、今すぐ立ち去るが良い。

Laravel mixでbrowserSyncを使ってブラウザの自動リロードをしている場合に、
ドキュメントに

<pre>

preタグがあると、閉じタグの前に謎の

<script>

scriptタグが挿入され
Vue.jsのテンプレートコンパイルエラーが出て怒られる。

Error compiling template

対処法は今のところ見つかっていないが、自動リロードしているタブじゃなければエラーは発生しないので
本番&ステージング環境などでは特に問題はなさそう。

ちなみにpreタグのある箇所の親divにv-preをつけてもエラーは消えない。

【キーワード】 Vue.js vue コンパイルエラー Error compiling template Laravel mix browserSync BrowserSync browser sync preタグ