質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Vuex

Vuexは、Vue.js アプリケーションのための状態管理ライブラリです。アプリケーション内で使用するコンポーネントのための集中データストアを提供。コンポーネント同士でデータをやり取りし、処理のフローを一貫させたり、データの見通しを良くすることができます。

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

Q&A

解決済

1回答

728閲覧

Laravel8 Vue2 でVuexを使用するとexport 'inject' (imported as 'inject') was not foundエラー

mikeko0901

総合スコア227

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Vuex

Vuexは、Vue.js アプリケーションのための状態管理ライブラリです。アプリケーション内で使用するコンポーネントのための集中データストアを提供。コンポーネント同士でデータをやり取りし、処理のフローを一貫させたり、データの見通しを良くすることができます。

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

0グッド

0クリップ

投稿2022/08/01 06:26

Laravel8 Vue.jsのバージョンは2でvuexを使用したくサンプルコードを試していますが、
npm run watchで以下のエラーが出てしまいます。

WARNING in ./node_modules/vuex/dist/vuex.esm-bundler.js 14:9-15 export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default) WARNING in ./node_modules/vuex/dist/vuex.esm-bundler.js 140:17-25 export 'reactive' (imported as 'reactive') was not found in 'vue' (possible exports: default) WARNING in ./node_modules/vuex/dist/vuex.esm-bundler.js 345:2-7 export 'watch' (imported as 'watch') was not found in 'vue' (possible exports: default) WARNING in ./node_modules/vuex/dist/vuex.esm-bundler.js 1078:9-14 export 'watch' (imported as 'watch') was not found in 'vue' (possible exports: default)

resources>js>app.js は以下になりますが、★部分をコメントアウトするとこのwarnは出てこないので、このvuexがいけないのかなと思ってます。
■resources>js>app.js

import './bootstrap' import Vue from 'vue' //spaで追加 import router from './router' //vuexで追加 import store from './store.js' //★コメントアウトするとwarnは出ない //ページネーションで追加 testコメント import Paginate from 'vuejs-paginate' //モーダルで追加 import VModal from 'vue-js-modal'; Vue.use(VModal); window.Vue = require('vue'); Vue.component('ShopOrder', require('./component/user/ShopOrder.vue').default); Vue.component('ShopOrderCheck', require('./component/user/ShopOrderCheck.vue').default); Vue.component('StripeCard', require('./component/user/StripeCard.vue').default); Vue.component('StripeCard3', require('./component/user/StripeCard3.vue').default); Vue.component('ShopComplete', require('./component/user/ShopComplete.vue').default); //ページネーションで追加 Vue.component('paginate', Paginate); //Vue.component('AccountList', require('./component/admin/AccountList.vue').default); これだと表示されない const app = new Vue({ el: '#app', router, //spaで追加 store: store, // ストアを追加する★コメントアウトするとwarnは出ない }) //これ何だっけ… //require('alpinejs');

以下はpackage.jsonです。
■package.json

{ "private": true, "scripts": { "dev": "npm run development", "development": "mix", "watch": "mix watch", "watch-poll": "mix watch -- --watch-options-poll=1000", "hot": "mix watch --hot", "prod": "npm run production", "production": "mix --production" }, "devDependencies": { "@tailwindcss/forms": "^0.3.3", "@tailwindcss/typography": "^0.4.1", "alpinejs": "^3.2.4", "axios": "^0.21", "laravel-mix": "^6.0.6", "lodash": "^4.17.19", "postcss": "^8.1.14", "postcss-import": "^14.0.2", "tailwindcss": "^2.2.7", "vue-loader": "^15.9.8", "vue-template-compiler": "^2.6.14", "vuex": "^4.0.2" }, "dependencies": { "@stripe/stripe-js": "^1.13.2", "@vue-stripe/vue-stripe": "^4.2.5", "vue": "^2.6.12", "vue-js-modal": "^1.3.35", "vue-router": "^3.5.2", "vuejs-paginate": "^2.1.0" } }

vuexをインストールする際に無邪気に

$ npm install --save-dev vuex

をしてしまいましたが、使用しているのはvue2なのでバージョンの関係でこのようなエラーが出てしまっているのかな…と思っているのですが…
どのようにすればよいか、アドバイスいただけますと幸いです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

自己解決

gitでvuexインストール前まで戻し、

npm install vuex@3.6.0 --save

というようにバージョン指定してvuexをインストールしたらエラーが出なくなりました。

投稿2022/08/01 15:53

mikeko0901

総合スコア227

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問