概要
Laravelでmaterializecss( https://materializeweb.com/ )を使いたいのですが、
エラーになります。
この解決方法がわかりません。
エラー内容
Uncaught TypeError: can't access property "AutoInit", _materializecss_materialize_dist_js_materialize_min_js__WEBPACK_IMPORTED_MODULE_2___default() is undefined
書いたコード
単純に以下のものになります。
LaravelMixのコンパイルは通りますが、
ブラウザでアクセスした際にエラーになります。
app.js
import './bootstrap';
import 'sweetalert2';
import M from '@materializecss/materialize/dist/js/materialize.min.js';
M.AutoInit();
webpack/mix/js
const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js')
.sass('resources/scss/app.scss', 'public/css', [])
;
考察
M.AutoInit();
でエラーになっていると思います。
これはmaterializecssのJavaScript関係を実行する際に実行しておかないと動かないようです。
公式には書かれています。
https://materializeweb.com/auto-init.html
なお、viteで同じようにしてみたのですがM.AutoInit();
でエラーになって動かなかったため、
LaravelMixに変更してみましたが結局M.AutoInit();
でエラーになり、こちらにて質問させていただいております。
環境
- windows11
- docker (WSL2 ubuntu)
- PHP8.3
- node 20
- Laravel v10.34.2
- materializecss 2.0.3-beta
こちら、原因をおわかりになる方がいらっしゃいましたらご教示をお願い致します。
よろしくお願いいたします。