vue.js - グローバル ストア オブジェクトのセットアップ方法

Question

私は vueify と browserify を使用しています。main.js ファイルにオブジェクトを作成しました

var store = {
foo: 'bar'
};

var vm = new Vue({
el: '#app',
data(){
    return {
        foo: store
    };
},

components: {
    Login,
    Registration,
    ClassifiedList,
    BusinessRegistration,
    BusinessUpdate,
    UserRegistration,
    ClassifiedForm,

    //  ClassifiedKfzCreateForm,
    // ClassifiedImmobilienCreateForm,
    // ClassifiedImmobilienEditForm,
    // ClassifiedKleinanzeigenCreateForm,
    // ClassifiedJobsCreateForm
}

});

これで Vue インスタンスで foo.store.foo で使用できるようになりました! しかし、コンポーネントで store オブジェクトを使用している場合、store オブジェクトは未定義ですか?

理由を知っている人はいますか？