Vue.js Webpack 编译错误：TypeError： __WEBPACK_IMPORTED_MODULE_1__ … is not a function

发布于05月13日

这是我的Api服务组件，我使用的是Axios:

import api from './Api.vue';

export default {
    name: 'app-feed-service',
    methods: {
        getPosts() {
            return api.get('posts/');
        }
    }
}

还有一些饲料成分

import AppSinglePost from './../Feed/Post.vue';
import AppFeedService from './../../api/Feed.vue';

export default {
    name: 'app-posts',
    components: {
        AppSinglePost
    },
    data() {
        return {
            posts: []
        }
    },
    created() {
        AppFeedService.getPosts().then((res) => {
            console.log(res);
        });
    }
}

现在是错误:

TypeError: __WEBPACK_IMPORTED_MODULE_1__api_Feed_vue___default.a.getPosts is not a function

有人能帮忙吗？

推荐答案

它看起来像Feed中定义的AppFeedService.vue并不是一个真正的组件，它只是一个你想要调用的服务集合.因为你已经把它定义为一个组件，所以组件必须在某个地方是instantiated，这在大多数情况下意味着你在另一个组件的template中使用了它.

你可以把它定义为一个对象.

import api from './Api.js';

export default {    
    getPosts() {
        return api.get('posts/');
    }
}

你的Api也是这样.很可能是vue文件.定义实际组件时，只需使用.vue文件.

然后在你的feed组件中

import AppFeedService from './../../api/Feed.js';

总而言之:.vue文件格式用于定义单个文件components.当您实际定义单个文件组件时，只需要一个.vue文件(可能会在另一个组件的template中使用).如果你只想要一个包含方法集合或状态的对象，只需要用普通的javascript来定义它.

Vue.js Webpack 编译错误：TypeError： __WEBPACK_IMPORTED_MODULE_1__ … is not a function

推荐答案

Vue.js相关问答推荐

为什么在Vue.js中修改非react 性似乎是react 性的？

vue js如何将布尔值传到数据库

如何解决 importers[path] is not a function for clean Vue 3/Vite/Storybook installation

nuxt.js auth 始终重定向到登录，而不是允许转到带有 auth： false 的页面，

Vue3如何将自定义事件绑定到路由视图中的特定组件？

vue js导航到带有问号的url

Vue子组件等待props

Vue 和 Bootstrap Vue - 动态使用插槽

在 Vue 中，如何使用 npm run build 将 .htaccess 包含到生产环境中？

将检测外部点击自定义指令从 Vue 2 迁移到 Vue 3

如何将Vue的主应用程序渲染到body元素？

如何将 ASP.NET Core 2.1 与 Vue CLI 3 集成？

即使在客户端设置 Access-Control-Allow-Origin 或其他 Access-Control-Allow-* 标头后也出现 CORS 错误

Modal 内部的 Vue.js AJAX 调用

如何将项目推送到 Vuejs 中数据对象的数组中？ Vue 似乎没有关注 .push() 方法

在路由更改之前显示确认对话框

如何在 JEST 测试中模拟全局 Vue.js 变量

vuejs 配置：使用全局变量？

带有 Firebase 云消息传递的 Vue pwa 无法正常工作

使用 Vee-validate 禁用按钮，直到正确填写表单