2017-08-25 126 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' 
相关问题