LaravelでVuetify導入時にエラー「DevTools failed to load source map」

Laravelを使っていて、

Vuetifyを導入していく時に、

フロントエンド側の検証ツールで、

エラーがいくつか発生してうまくいかなかった。

これを調べて対応していくことで、

とりあえず、動くところまで進めた時のメモ。

前提：Vuetifyとは？

Vuetifyは、

Vue.jsのための、

UI Frameworkです。

個人的には、

  • マテリアルデザインで作られている
  • コンポーネントも比較的多い

という点で、

Vuetifyを導入する事にしました。

「Vuetify」のページ

エラー「DevTools failed to load source map」

エラーとしては、

上記のライブラリを導入したときに、

DevTools failed to load source map: 
Could not load content for https://hoge.com/js/vuetify.js.map: 
HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

というエラーが発生していた。

このエラーに関しては、

package-folder/node_modules/vuetify/dist

のフォルダの中に、

vuetify.js.map

のファイルがあるので、

Laravelのアプリケーションが読み取ってくれる

package-folder/public/js

に対して配置することで解決。

就職/転職に向けてスキルを高めるために

プログラミングのスキルを高めるために、

以下のサイトを参考にしてみてください。

元Yahooエンジニアの超実践型プログラミングスクール「PRUMエンジニア留学」
Freeks(フリークス)｜サブスク型プログラミングスクールの申込
未経験からITエンジニアを目指すサポートに特化した「ウズキャリIT」

おすすめ書籍

コメント一覧

コメントはまだありません。

コメント送信

コメントを残す

関連記事

広告

おすすめ記事