Module not found: Error: Can't resolve '../../../vue-temp/vue-editor-bridge' in 'D:\laravel projects\codeGram\resources\js\components'

Question

i am using laravel + vuejs to do the follow and unfollow button of instagram clone , but i get this error i did everything i could, checked the config.js , deleted the module package and again run the npm install but it didnt work here is my code

<template>
    <div>
    <button class="btn btn-primary ml-4" @click="followUser" v-text="buttonText">Folloq</button>
    </div>
</template>

<script>
import func from '../../../vue-temp/vue-editor-bridge';

    export default {
        props: ['userId', 'follows'],

        watch: {
            status: function() {
                this.buttonText = (this.status) ? 'Unfollow' : 'Follow';
            }
        },

        data: function () {
            return {
                status: this.follows,
                buttonText: this.follows ? 'Unfollow' : 'Follow'
            }
        },

        methods: {
            followUser() {
                 axios.post('/follow/' + this.userId)
                    .then(response => {
                        this.status = ! this.status;

                        console.log(response.data);
                    })
                    
                    .catch(errors => {
                        if (errors.response.status == 401){
                            window.location = '/login';
                        }
                    });
            }
        },
    }
</script>

my code in the view in index.blade.php for the button is

 <follow-button user-id="{{$user->id}}"  follows="{{ $follows }}"></follow-button>

route is Route::post('follow/{user}','App\Http\Controllers\FollowsController@store');

full error

ERROR in ./resources/js/components/FollowButton.vue?vue&type=script&lang=js& (./node_modules/babel-loader/lib/index.js??clonedRuleSet-5[0].rules[0].use[0]!./node_modules/vue-loader/lib/index.js??vue-loader-options!./resources/js/components/FollowButton.vue?vue&type=script&lang=js&) 7:0-55 Module not found: Error: Can't resolve '../../../vue-temp/vue-editor-bridge' in 'D:\laravel projects\codeGram\resources\js\components'

The errors tells you that the relative file path does not actually point to a module. What is your directory structure? If you use an IDE, try using the auto-import feature and see if the import statement is updated? — Terry

Sever van Snugg Sever van Snugg · Accepted Answer · 2021-02-04T10:54:21

I assume you don't want to use this at all:

import func from '../../../vue-temp/vue-editor-bridge';

Vscode imports this 'func' from a module when you want to autocomplete while writing function. This is totally annoying and if anybody knows how to turn it off, you would be my personal hero!

Module not found: Error: Can't resolve '../../../vue-temp/vue-editor-bridge' in 'D:\laravel projects\codeGram\resources\js\components'

3 Answers