TypeScript选项‘importsNotUsedAsValues‘和‘preserveValueImports‘弃用(typescriptlang)

TypeScript选项‘importsNotUsedAsValues‘和‘preserveValueImports‘弃用

推荐整理分享TypeScript选项‘importsNotUsedAsValues‘和‘preserveValueImports‘弃用(typescriptlang)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:typescript instanceof,typescript enum,typescriptreact,typescript import,typescript implements,typescript import,typescript enum,typescript import,内容如对您有帮助，希望把文章链接给更多的朋友！

TypeScript 从5.0开始，选项“importsNotUsedAsValues”和“preserveValueImports”已经被标记为Deprecated，并将在TypeScript5.5之后停止支持，可以使用“verbatimModuleSyntax”选项替代。

默认情况下，假如你在TypeScript中写下如下代码：

import { Car } from "./car";export function drive(car: Car) { // ...}

TypeScript检测到您只对类型定义导入，就会完全删除导入。输出的JavaScript可能如下：

export function drive(car) { // ...}

如果 ./car 文件中仅仅定义了type 或者interface，转换为javascript时这些定义被抛弃，是正确。但是，如果 ./car中的Car是一个class，里边还包括了一些其他定义。这个文件被抛弃。最终的javascript可能会产生Runtime error。

importsNotUsedAsValues选项就解决了这个问题。

此标志控制导入的工作方式，有三种不同的选项：

remove：丢弃没有使用的import。【默认值】preserve：保留所有的import，即使从来没有使用过的定义。error：基本上和preserve选项一致，但是，当值（value）被import仅用作 type 时会报错。如果您希望确保没有意外导入任何值，此时可以使用此选项。

preserveValueImports作用：

例如：

import { Animal } from "./animal.js";eval("console.log(new Animal().isDangerous())");

这样的代码编译器不知道是否该保留还是该抛弃。如果想保留，请使用preserveValueImports选项

importsNotUsedAsValues、preserveValueImports还有一个isolatedModules共三个选项，比较难以理解，有时候使用时仍旧有一些边缘情况导致非期盼的结果。

从TypeScript5.0开始，引入了verbatimModuleSyntax选项（值为 true，false）。使用type修饰符，就明确保留还是抛弃，以简化以上情况。

任何不带类型修饰符的导入或者导出都会被保留。任何使用类型修饰符的内容都将被完全删除。// This statement can be dropped entirely in JS outputimport type * as car from "./car";// The named import/export 'Car' can be dropped in JS outputimport { type Car } from "./car";export { type Car } from "./car";// Erased away entirely.import type { A } from "a";// Rewritten to 'import { b } from "bcd";'import { b, type c, type d } from "bcd";// Rewritten to 'import {} from "xyz";'import { type xyz } from "xyz";

使用此选项后，实现了所见即所得。有type修饰符的，明确只使用了定义，编译时直接抛弃；没有使用type修饰符的，编译时就会保留其内容。

一般情况下，vscode会首先使用自带的TypeScript版本。最近升级后TypeScipt默认都会是5.X版本。

如果想继续使用5.x版本，增加一个选项： 在tsconfig.json 中增加 "ignoreDeprecations": "5.0"，就不再报警了。

项目如果想切换到4.X版本：

切换TypeScript版本：首先确保在本项目已经有TypeScript4.x 如果没有可以 npm install typescript @4.9 然后

第一种方法：快捷键：Ctrl + Shift + P 然后输入 Typescript: Select Typescript Version，选择本项目的版本。 第二种方法：打开一个ts或者tsx文件。右下角有TypeScript JSX字样，在左边的{ }上，鼠标悬停，在弹窗中点击目前的TypeScript版本。然后会让选择新的TypeScript版本。

OK，切换成功。