TypeScript 配置 script 脚本 CrossOrigin 从 .env 文件读取时报 TS2322 类型不匹配

原因

.env文件中配置的变量默认是string字符串类型。

TypeScript中script脚本标签中的CrossOrigin属性允许的值是anonymous、use-credentials、""、undefined。

解决

使用as强制类型转换，将.env文件中读取到的string字符串类型强转为anonymous、use-credentials等。

代码

export default function MyScript() {
    return <Script src={process.env.JS}
                   crossOrigin={process.env.CROSSORIGIN as "anonymous" | "use-credentials"}
    >
    </Script>
}

源码

type CrossOrigin = "anonymous" | "use-credentials" | "" | undefined;

备注

as类似其他语言中的强制类型转换。