ホーム > Laravel > Laravelでlaravel-mixを１から６にアップデートした方法・手順
Laravel

Laravelでlaravel-mixを１から６にアップデートした方法・手順

いつもご利用ありがとうございます。
この記事には広告が掲載されており、その広告費によって運営しています。

目次

  1. はじめに
  2. laravel-mix をアップデートする手順
  3. まとめ
PR

Laravel で laravel-mix を１から６にアップデートした方法・手順についてまとめました

はじめに

すでに Laravel プロジェクトの中で Vue を使っている状態でした。

Laravel 6

Laravel Mix - Upgrade to Mix 6に書かれている中で、自分が実際に行った作業を書いています。

laravel-mix をアップデートする手順

1. コマンドで新しいパッケージインストール

npm install laravel-mix@^6.0.0
npm install vue-template-compiler

2. package.json を変更する

修正前

    "scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "npm run development -- --watch",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
    },

修正後

  "scripts": {
    "development": "mix",
    "watch": "mix watch",
    "watch-poll": "mix watch -- --watch-options-poll=1000",
    "hot": "mix watch --hot",
    "production": "mix --production"
  },

3. webpack.mix.js に追記

mix
  .js("resources/assets/js/app.js", "public/js")
  .sass("resources/assets/sass/app.scss", "public/css")
  .vue() //追記

上記のように.vue()を追記します。

これで動きました。

まとめ

自分がやったことは以上です。

誰かの参考になればと思います。

フィードバックのお願い
この記事のフィードバックがありましたらYoutubeの適当な動画にコメントしていただいたり、お問い合わせからご連絡ください。