如何修复：Esri-Leaflet-Geocoder类型无'geocodeService'属性错误

我在使用@types/esri-leaflet-geocoder包时遇到了类型问题，报错提示找不到geocodeService属性。

我的导入方式 #

import * as L from 'leaflet';
import 'esri-leaflet';
import * as ELG from 'esri-leaflet-geocoder';

使用代码 #

const geocodeServiceResult = ELG.geocodeService({ apikey: apiToken });

geocodeServiceResult
  .suggest()
  .text(value)
  .within([
    [boundaryBox.ymin, boundaryBox.xmin],
    [boundaryBox.ymax, boundaryBox.xmax],
  ])
  .run((err, response) => {
    if (err) {
      console.error(err);
      return;
    }
    console.log("Response suggestions are:", response)
    if(response.suggestions && response.suggestions.length > 0)
    {
      setSuggestions(
        response.suggestions.map((suggestion: AddressSuggestion) => ({
          text: suggestion.text
        }))
      );
    }
  });
} else {
  setSuggestions([]);
}

遇到的TypeScript错误 #

Property 'geocodeService' does not exist on type 'typeof import("MyPath/node_modules/@types/esri-leaflet-geocoder/index")'

我的tsconfig配置 #

{
  "compilerOptions": {
    "target": "es2017",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "noUncheckedIndexedAccess": true
  },
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx",
    "**/*.cjs",
    "**/*.mjs",
    "**/*.js"
  ],
  "exclude": ["node_modules"]
}

已尝试的导入方式 #

• 直接引入包：

import * as L from 'leaflet';
import 'esri-leaflet';
import 'esri-leaflet-geocoder';

• 单独导入ELG：

import * as ELG from 'esri-leaflet-geocoder';

• 尝试通过L.esri.Geocoding调用：

import * as L from 'leaflet';
import 'esri-leaflet';
import 'esri-leaflet-geocoder';

// 调用时触发空引用异常
L.esri.Geocoding.geocodeService(...)

请求帮助解决该类型错误。

内容的提问来源于stack exchange，提问作者avenmia