2017-08-25 124 views
1

我已經在這個錯誤3天,不知道這是一個錯誤,但我安裝vuejs從vuejs/vue-cliVuejs未從mixins中讀取屬性並導出NOT FOUND錯誤。

使用下面的說明:

npm install -g vue-cli 
vue init webpack foo.com 
cd foo.com 
npm install 
npm run dev 

到目前爲止,它的工作原理,現在我創建像這樣的目錄結構中src/

— src 
    — assets 
    — filters 
    — config 
    — components 
     Profiles.vue 
     Login.vue 
    profiles.js 
    routes.js 
    main.js 

所以,在routes.js我有這樣的事情。

// routes.js 
import ProfilesView from './components/Profiles.vue' 
import LoginView from './components/Login.vue' 

const routes = [{ 
    path: '/profiles', 
    component: ProfilesView 
}, 
{ 
    path: '/login', 
    component: LogoutView 
}] 

export default routes 

到目前爲止,我有上面的代碼沒有問題,問題來自於這兩個文件下方要麼profiles.jsProfiles.vue

這裏是profiles.js

const profiles = Vue.mixin({ 
    data: function() { 
    return { profiles: [] } 
    }, 
    methods: { 
    fetchProfiles: function(){....}, 
    mounted: function(){ this.fetchProfiles() } 
}) 

export default profiles 

這裏資料.vue

<template lang="html"> 
    <div> {{ profiles }}<div> 
</template> 

<script> 
    import { profiles } from '../../profiles' 
    export default { 
    mixins: [profiles], 
    data() { 
     return { profiles: [] } 
    }, 
    mounted() {} 
    } 
</script> 

<style lang="css"> 
</style> 

通過上面的代碼,我得到了這些錯誤。

profiles.js:1 Uncaught ReferenceError: Vue is not defined 
    at Object.<anonymous> (profiles.js:1) 
    at __webpack_require__ (bootstrap 1995fd0fa58cb1432d6f:659) 
    at fn (bootstrap 1995fd0fa58cb1432d6f:85) 
    at Object.defineProperty.value (app.js:55806) 
    at __webpack_require__ (bootstrap 1995fd0fa58cb1432d6f:659) 
    at fn (bootstrap 1995fd0fa58cb1432d6f:85) 
    at Object.<anonymous> (Profiles.vue:7) 
    at __webpack_require__ (bootstrap 1995fd0fa58cb1432d6f:659) 
    at fn (bootstrap 1995fd0fa58cb1432d6f:85) 
    at Object.__webpack_exports__.a (app.js:56033) 

如果我添加import Vue from 'vue'profiles.js上述錯誤獲取與此一個取代:

Uncaught TypeError: Cannot read property 'components' of undefined 
    at checkComponents (vue.esm.js:1282) 
    at mergeOptions (vue.esm.js:1363) 
    at mergeOptions (vue.esm.js:1379) 
    at Function.Vue.extend (vue.esm.js:4401) 
    at Object.exports.createRecord (index.js:47) 
    at Profiles.vue:26 
    at Object.<anonymous> (Profiles.vue:30) 
    at __webpack_require__ (bootstrap 625917526b6fc2d04149:659) 
    at fn (bootstrap 625917526b6fc2d04149:85) 
    at Object.__webpack_exports__.a (app.js:56036) 

這是在抱怨profiles.jsmixins: [profiles],,我想profiles道具是不確定的,但不是案子。出於某種原因,Profiles.vue不讀書或讀profiles.js正確的數據,因爲我也總是得到這樣的錯誤:

[HMR] bundle has 1 warnings 
client.js:161 ./~/babel-loader/lib!./~/vue-loader/lib/selector.js?type=script&index=0!./src/components/Profiles.vue 
6:11-15 "export 'profiles' was not found in '../../profiles' 

據抱怨export default profilesprofiles.js發現,即使它顯然不。我甚至嘗試過使用require,改變路徑......一切。什麼都沒有

我將不勝感激任何幫助。

+0

你可以提供一個存儲庫的鏈接?看到你省略了代碼的一部分(這通常對於可讀性來說是好的),很難判斷哪些特定部分的代碼被錯誤消息引用。 – PixelMaster

+1

從'../../ profiles''導入{profiles}不正確,因爲您沒有導出名爲'profiles'的屬性的對象。嘗試從'../../ profiles'' – thanksd

+1

同意@thanksd !!!導入配置文件!另外如果你只是想在本地使用mixin,那麼不要使用(Vue.mixin)[https://vuejs.org/v2/guide/mixins.html#Global-Mixin],因爲它會創建一個可能衝突的全局混合與其他組件並導致無意的行爲 –

回答

3

你以錯誤的方式導入profiles.js

import { profiles } from '../../profiles' 

由於您使用export default,它應該是

import profiles from '../../profiles' 
相關問題