常规 JS 中的 TypeScript 检查和声明

TypeScript checks and declarations in regular JS

所以基本上我想在编辑器 (VS Code) 中使用 TypeScript 检查我的代码是否有错误,但不想执行任何转换步骤。

我的代码在 .js 文件中,"allowJs": true 在 tsconfig.json

唯一的问题是,编辑器会抱怨在 js 文件中使用 typescript-words,例如:

declare module "something" {
    export interface MyInterface {

导致错误:

 "'module' declarations can only be used in TypeScript files"

我尽量不在乎,但不幸的是,它也会导致错误,而 运行 实际的 (node.js) 程序!

SyntaxError: Unexpected strict mode reserved word
    at Loader.moduleStrategy (internal/modules/esm/translators.js:145:18)

我不能以某种方式在没有 TS 的情况下进行 TS 检查吗?

我知道我可以,我的意思是它就在那里,但我必须在应用启动前删除与 TS 相关的所有内容。

IDK 也许有人有一个……转译器? :D

令人惊讶的是,在 Internet 上没有太多关于此的信息。

我不会TS转JS的原因:

是的,你绝对可以。而且您也不需要 TypeScript 声明文件。

如果你有 checkJs flag set in either CLI config or your tsconfig.json file. allowJs actually has nothing to do with it, that just enforces whether you can import vanilla JS files into TS/TSX files,TypeScript 会很乐意检查你的 vanilla JS 代码(它不关心你是否将 JS 导入 JS)。 JSDoc 注解实际上是在混合代码库中混合 vanilla JS 和 TS 代码的好方法,例如,如果您正在将代码从 JS 迁移到 TS。

TypeScript(即使没有 JSDoc 注释)将为您提供大量有用的“隐式”类型检查,而无需编写任何额外的语法,只需检测您声明变量的方式并假设它们的类型不应该改变(以及其他推论) :


// Implicit TypeScript typing
let myBooleanValue = false;
myBooleanValue = 'true'; // Error: Type 'string' is not assignable to type 'boolean'.ts(2322)

但是,如果您想要更多控制,TypeScript 与 JSDoc type annotations 完全兼容。请务必阅读文档并使用正确的注释语法(例如 /** ... */ 而不是 // ...)。 JSDoc不能用 TypeScript 语法做的几乎没有,它只是有点冗长:

// Explicit JSDoc typing
/**
 * @type {string}
 */
let myVar;
myVar = 7; // Error: Type 'number' is not assignable to type 'string'.ts(2322)

您可以使用它获得更高级的东西,声明函数参数、对象结构和嵌套字段、return 值等等:

/**
 * @param {object} myParam
 * @param {number} myParam.myNumber
 * @returns {boolean} // Error: A function whose declared type is neither 'void' nor 'any' must return a value.ts(2355) (because nothing is currently returned from myFunction)
 */
function myFunction(myParam) {
  let myNumberCopy = myParam.myNumber;
  let myMissingPropertyCopy = myParam.myMissingProperty; // Error: Property 'myMissingProperty' does not exist on type '{ myNumber: number; }'.ts(2339)
}

你甚至可以做一些疯狂的事情,比如从其他文件或包中导入类型,并在你的 JSDoc 注释中使用它:

/**
 * @type {import("React").FC}
 */
const MyComponent = () => null;

这是我在上面的示例中使用的 tsconfig.json 文件,除了安装了基本的 typescript NPM 包外什么都没有:

{
  "compilerOptions": {
    "module": "es6",
    "noEmit": true,
    "checkJs": true,
    "moduleResolution": "node"
  },
  "include": ["src/**/*"]
}

视觉证明这一切在 VSCode 中都很有效:

使用此设置,“测试”整个代码库中是否有任何类型错误的好方法是 运行 npx tsc --noEmit,这将 运行 TypeScript 检查(包括根据您的 tsconfig.json 文件,所有文件的 JSDoc 注释)。