Blazor TypeScript互操作：正确导入DotNet声明且避免冗余JS代码

可行方案1：类型导入+全局变量声明 #

因为DotNet是Blazor运行时自带的全局变量，我们只需要让TypeScript识别它的类型，不需要实际导入模块文件。操作步骤：

• 先通过类型导入拿到DotNet的类型定义：

import type { DotNet as DotNetType } from "@microsoft/dotnet-js-interop";

• 接着声明全局的DotNet变量并绑定类型：

declare var DotNet: DotNetType;

这样TypeScript会认可DotNet作为全局值存在，而且类型导入不会被编译到最终JS里，完全符合需求。

可行方案2：通过tsconfig全局引入类型 #

如果不想每个TS文件都写声明，可以直接修改tsconfig.json，让编译器自动加载@microsoft/dotnet-js-interop的类型：

{
  "compilerOptions": {
    // 保留你的其他配置
    "types": ["@microsoft/dotnet-js-interop"]
  }
}

之后在TS代码里直接用DotNet即可——TypeScript会自动识别它的类型，编译后的JS也不会多出不必要的导入语句。

为什么之前的方案没效果？ #

• 用import type { DotNet }后直接用DotNet：TypeScript的import type仅用于获取类型，不能作为值引用，所以必然报错。
• 错误的引用指令：你写的///<reference>格式有误，正确格式应为/// <reference types="@microsoft/dotnet-js-interop" />，但这种方式不如配置tsconfig的types省心。

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