typescript - 如何在打字稿中扩展 NuxtRuntimeConfig 接口

Question

我在 nuxt$config变量中添加一个变量，就像在文档中一样。这行得通。

我试图让打字稿知道这个变化。

在我的nuxt.config.js我有：

// nuxt.config.js. This is to add the variable
  publicRuntimeConfig: {
    baseUrl: process.env.URL || 'http://localhost:3000',
  }

我试图像这样扩展接口

// vue.shim.ts
declare module '@nuxt/types' {
  interface NuxtRuntimeConfig {
    baseUrl: string
  }
}

但是 vscode 仍然没有改变

const { $content, route, $config } = useContext()
console.log($config.baseUrl) // typescript does not no about baseUrl, but it exists

标签： typescriptvue.jsnuxt.js

Answer 1

您快到了！

您必须用来触发接口合并的模块实际上是类型文件的路径。所以在这里，它是@nuxt > types > config > runtime.d.ts

declare module '@nuxt/types/config/runtime' {
  interface NuxtRuntimeConfig {
    baseUrl: string
  }
}