无法从 2.0RC 中的组件访问 vue-resource 的$http方法

Question

我在2.0RC的.vue组件中获得vue-resource工作时遇到了麻烦。它在1号运行得很好。当从组件方法中访问this时，$http方法似乎缺失了。

我正在使用webpack和我的app.es6文件看起来像:

import Vue from 'vue/dist/vue.js'
import VueRouter from 'vue-router'
import VueResource from 'vue-resource'
import Login from './Login.vue'
Vue.use(VueResource);
Vue.use(VueRouter);
const router = new VueRouter({
    mode: 'history',
    base: __dirname,
    routes: [
        { path: '/login', component: Login }
    ]
})
const App = new Vue({
    router: router,
    el: "#vue-app",
    template: '<div><router-view></router-view></div>',
    created: function(){
        console.log('data this: ', this.$http()) //this $http.get() works
    }
})

我的登录。Vue看起来像:

<template>
    <div>
        <h2>Log In</h2>
        <button class="btn btn-primary" @click="submit()">Access</button>
    </div>
</template>
<script type="text/ecmascript-6">
    export default {
        methods: {
            submit: function () {
                console.log('Login this.$http()', this.$http.get) //this $http.get() does not work
            }
        }
    }
</script>

1. 2.0在某种程度上破坏了一些东西，但是vue-resource文档还没有更新。
2. 这与从版本1的Vue.extend(...) and Vue.start(...)到我现在使用的new Vue()语法的变化有关。
3. 我需要使用新的vue-router语法做一些不同的事情。

谢谢你的帮助

Answer 1

我在Vue帮助论坛上得到了一个答案。出现这个问题是因为我使用的是Vue的独立版本，但没有在Webpack中完全混叠，所以Webpack加载了两个不同的版本。

用户LinusBorg回答:

你需要独立的构建，但是webpack也在加载只运行时构建，因此在您的项目-一个有vue-resource，另一个没有。

如果你想保持独立的构建，你必须添加一个别名你的webpack配置:vue: 'vue/dist/vue'

为了防止其他人也有这个问题，并且和我一样被webpack弄糊涂了，我要更明确一点:

Webpack正在加载两个不同版本的vue.js，一个来自我的文件内import语句，一个来自Webpack *.vue模块加载器。我修复它的确切方法是将以下内容添加到我的webpack-config.js:

resolve: {
    alias: {vue: 'vue/dist/vue.js'}
},

在我的app.es6文件中，我还必须将从'vue/dist/vue.js'导入Vue更改为从'vue'导入Vue。