Laravelでviteのビルドに苦戦した話。

2024.02.29

Logging

おはようございます。laravel-mixからviteに変わっていたのは知っていたのですがビルドしたvue3をbladeファイルで呼び出しても動かなかった事で一日かかった馬しかです。 結論から言えば、vueを参照するじゃなくてvue/dist/vue.esm-bundler.jsで参照する。 これで@vite(‘resources/js/app.js’)呼び出せばビルドした先の参照ファイルを呼び出せる。 尚、ビルドしたファイルはパブリックディレクトリの中にあります😅。

import { createApp } from "vue";//ビルドしてもLaravel側で動かない
import { createApp } from "vue/dist/vue.esm-bundler.js";//こうするとビルドすると動く。
//ブレイド側の呼び出しは@vite('ビルドしたファイル名')
//ビルドするファイルの設定はルートディレクトリにあるvite.config.jsを変更すると良い。

知っている人に取っては簡単な話ですが、そこまでたどり着くのにかなりググりました、因みにchatGPTもGeminiもあまり良いヒントは与えてくれなかったです。

明日へ続く。

タグ

app.js, bladeファイル, chatGPTもGemini, createApp, dist, import, Laravel-Mix, Laravel側, quot;vue, quot;vue&quot, resources, vite, vite.config.js, vue, vue.esm-bundler.js, vue.esm-bundler.js&quot, vue3, パブリックディレクトリ, ルートディレクトリ, 馬しか,

Laravelでenvの情報をvueとかに共有する時の落とし穴。

2023.06.30

Logging

おはようございます、LaravelにはLaravel-Mixというものが入っていてこれを使用するとenvの値をVue.jsなんかと共有出来るのだけど、自分の知る限り値は全て文字列になるということ、例えばfalseという値を渡しても文字列になってしまいtrueと判断されてしまうのです。

これが落とし穴ですね、普通にfalseが入っているものだと思い込んでいて先日、数分悩んでおりました。

皆さんも思い込みの落とし穴には注意しましょうということです。あとlaravel Mixを使用する場合、envの頭文字にはMIX_と書かないとデータは渡されませんのでご注意を。

MIX_HOGEHOGE=false

思い込みはやばい。そう思い込んでいるとそこから抜け出せない事があると思います、人の話を鵜呑みにしないようにはよく聞くと思いますが。TVの話を鵜呑みにしないようにとか、ネットの話を鵜呑みにしないようにとかを注意がけている人はあまりいないじゃないかな？、ついついあぁそうなんだと聞き入れている人がいると思いますが、本当にそうなのかと疑問を持つことは大事。

トイウコトデ、思い込みはやばいでした？

タグ

env, false, Laravel, Laravel-Mix, MIX, MIX_HOGEHOGE, TV, vue.js, データ, トイウコトデ, 値, 全て文字列, 文字列, 疑問, 皆さん, 落とし穴, 限り値, 頭文字, 鵜呑み,