未找到模块：错误：无法解析 'D:\laravel projects\codeGram\resources\js\components' 中的 '../../../vue-temp/vue-edito

Posted 2023-02-22

【中文标题】未找到模块：错误：无法解析 \'D:\\laravel projects\\codeGram\\resources\\js\\components\' 中的 \'../../../vue-temp/vue-editor-bridge\'

【英文标题】：Module not found: Error: Can't resolve '../../../vue-temp/vue-editor-bridge' in 'D:\laravel projects\codeGram\resources\js\components'未找到模块：错误：无法解析 'D:\laravel projects\codeGram\resources\js\components' 中的 '../../../vue-temp/vue-editor-bridge'

【发布时间】：2021-04-28 18:03:27

【问题描述】：

我正在使用 laravel + vuejs 来执行 instagram clone 的关注和取消关注按钮，但我得到了这个错误我尽我所能，检查了 config.js，删除了模块包并再次运行 npm install 但它没有在这里工作是我的代码

<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>

我在 index.blade.php 视图中的代码是

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

路线是 Route::post('follow/user','App\Http\Controllers\FollowsController@store');

完全错误

./resources/js/components/FollowButton.vue?vue&type=script&lang=js& (./node_modules/babel-loader/lib/index.js??clonedRuleSet-5[0].rules[0].使用[0]!./node_modules/vue-loader/lib/index.js??vue-loader-options!./resources/js/components/FollowButton.vue?vue&type=script&lang=js&) 7:0-55 未找到模块：错误：无法解析 'D:\laravel projects\codeGram\resources\js\components' 中的 '../../../vue-temp/vue-editor-bridge'

【问题讨论】：

错误告诉你相对文件路径实际上并不指向一个模块。你的目录结构是什么？如果您使用 IDE，请尝试使用自动导入功能，看看 import 语句是否更新？

你能把你的文件夹结构放进去吗？

【参考方案1】：

我假设你根本不想使用它：

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

当你想在编写函数时自动完成时，Vscode 从模块中导入这个“函数”。这很烦人，如果有人知道如何将其关闭，您将是我的个人英雄！

【参考方案2】：

VS Code 自动添加到您的代码行中，例如：

import func from 'vue-editor-bridge'

在您的代码中找到它并将其删除。完成！

【讨论】：

答案和我的一样。

【参考方案3】：

我也遇到了这个问题，它发生的原因是，我没有在代码中输入完整的 function，而是使用了 function 的自动完成版本，即 func，因为 func 在 Vue 中是完全不同的东西，相对于函数来说，Vue 只是放了import func from 'vue-editor-bridge'。

只需将单词func 更改为function 并在脚本标签中删除此导入即可。

对我来说就是这样。