类型错误:在Chrome扩展中使用AXIOS和webpack时适配器不是函数错误

TypeError: adapter is not a function error when using axios and webpack in Chrome extension(类型错误:在Chrome扩展中使用AXIOS和webpack时适配器不是函数错误)

本文介绍了类型错误:在Chrome扩展中使用AXIOS和webpack时适配器不是函数错误的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在构建一个Chrome扩展,当从内容脚本接收到某些消息时,它需要进行API调用。我无法发出Http请求,我认为是我的webpack配置造成的。

我已尝试使用node-fetchaxios,但这两个选项对我都不起作用。

我的webpack.common.js文件如下所示:


const path = require("path");

module.exports = {
  target: "node",
  entry: {
    popup: path.join(__dirname, "src/popup/index.tsx"),
    background: path.join(__dirname, "src/background.ts"),
    contentScript: path.join(__dirname, "src/contentScript.ts"),
  },
  output: {
    path: path.join(__dirname, "dist"),
    filename: "[name].js",
  },
  module: {
    rules: [
      {
        exclude: /node_modules/,
        test: /.tsx?$/,
        use: "ts-loader",
      },
      {
        exclude: /node_modules/,
        test: /.scss$/,
        use: [
          {
            loader: "style-loader", // Creates style nodes from JS strings
          },
          {
            loader: "css-loader", // Translates CSS into CommonJS
          },
          {
            loader: "sass-loader", // Compiles Sass to CSS
          },
        ],
      },
    ],
  },
  resolve: {
    extensions: [".ts", ".tsx", ".js"],
  },
};

当脚本尝试从Chrome扩展调用axios时,我收到此错误:


dispatchRequest.js:52 Uncaught (in promise) TypeError: adapter is not a function
    at dispatchRequest (dispatchRequest.js:52)

推荐答案

我好像迟到了10个月,但这对任何有同样问题的人都很有用。从Axios迁移到FETCH可能是一个很好的选择,但是如果您在Axios之上构建了一个带有所有实用程序(拦截器、取消等)的自定义API,则需要做大量工作,因此有一个简单的修复方法:

Axios在其configuration中接受适配器字段,因此您可以传递类似axios-fetch-adapter的FETCH适配器,而且您可能还需要添加regenerator-runtime,因此在backround.js文件中:

import "regenerator-runtime/runtime.js";

这篇关于类型错误:在Chrome扩展中使用AXIOS和webpack时适配器不是函数错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本文标题为:类型错误:在Chrome扩展中使用AXIOS和webpack时适配器不是函数错误

基础教程推荐