vue.js - “在'vue'（Vuex，Store）中找不到导出'default'（导入为'Vue'）

问题描述

我是 Vue 的新手，我想使用 Vue 重建现有的 CMS。在我构建身份验证系统时，出现了这个错误：

 WARNING  Compiled with 1 warnings                                                                                                                                                                                                                           17:16:12
 warning  in ./src/store/index.js

"export 'default' (imported as 'Vue') was not found in 'vue'

浏览器控制台告诉我这个：

Uncaught TypeError: Cannot read property 'use' of undefined
    at eval (index.js:10)
    at Module../src/store/index.js (app.js:1337)
    at __webpack_require__ (app.js:849)
    at fn (app.js:151)
    at eval (cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader-v16/dist/index.js?!./src/views/auth/Login.vue?vue&type=script&lang=js:2)
    at Module../node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader-v16/dist/index.js?!./src/views/auth/Login.vue?vue&type=script&lang=js (app.js:974)
    at __webpack_require__ (app.js:849)
    at fn (app.js:151)
    at eval (Login.vue?vue&type=script&lang=js:2)
    at Module../src/views/auth/Login.vue?vue&type=script&lang=js (app.js:1469)

我的 main.js 文件：

import App from './App.vue'
import { createApp } from 'vue'
import router from './router'

createApp(App).use(router).mount('#app')

我的商店/index.js 文件：

import Vuex from 'vuex'
import Vue from 'vue'
import axios from 'axios'

Vue.use(Vuex)
axios.defaults.baseURL = 'https://[blablabla]/api'

export const store = new Vuex.Store({
    state: {
        access_token: window.localStorage.getItem('access_token') || null,
        filter: 'all',
        todos: []
    },
    getters: {
        access_token: state => {
            return state.access_token;
        }
    },
    mutations: {
        retreiveToken(state, token) {
            state.access_token = token;
        }
    },
    actions: {
        authenticate(context, credentials) {
            axios.post('/user/authenticate.php', { username: credentials.username, password: credentials.password })
                .then(response => {
                    // const token = response.data.access_token
                    // localStorage.setItem('access_token', token)
                    // context.commit('retrieveToken', token)
                    console.log(response)
                })
                .catch(error => {
                    console.log(error)
                })
        }
    }
})

我的 /views/auth/Login.vue 脚本：

<script>
import { store } from '@/store'

export default {
    name: 'Login',
    data() {
        return{
            username: '',
            password: ''
        }
    },
    methods: {
        login(){
            store.dispatch('authenticate', {
                username: this.username,
                password: this.password
            })
        }
    }
}
</script>

当我删除“Vue.use（Vuex）”时，浏览器错误：

 [vuex] must call Vue.use(Vuex) before creating a store instance

有人能告诉我这里发生了什么吗？谢谢！

标签： vue.jsvuex

vue.js - “在'vue'（Vuex，Store）中找不到导出'default'（导入为'Vue'）

问题描述

解决方案

推荐阅读