TypeScript 类转换为 ES2015 会生成导入路径错误

Question

我正在尝试将我在 TypeScript 中创建的一些简单类转译为 ES2015 模块。我有一个名为

Grid

:

的主类

import { type GridColumn, type GridFilter,  type GridDataItem } from './types';
import { 
    throwException, 
    USR_INV_PROP 
} from './exceptions';

export class Grid {
    // Code suppressed for brevity
}

这是我的

tsconfig.json

:

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["es6"], 
    "module": "ES2015",
    "outDir": "./dist",
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "strict": true, 
    "skipLibCheck": true
  }
}

这几乎是

tsc --init

创建的默认文件。

但是当我尝试将其用作普通

<script type="module" src="/dist/grid.js"></script>

时，它会引发

exceptions

类导入路径的异常，生成如下：

浏览器找不到它。我该如何解决它？

更新：

问题是导入文件必须有扩展名才能让浏览器找到它。如果我在

.js

末尾添加

'.exceptions'

就可以了。如何在编译器进程中保留扩展名？

Answer 1

import { throwException, USR_INV_PROP } from './exceptions.js';

添加“.js”将解决您的问题。另外，您不需要保留任何类型，只需保留“.js”即可。您的 IDE 和 Typescript 知道您指的是转译的 JS 文件。