问题描述
0。要求
typescript@4.3.4
- 编辑器:VSCode 1.15.7
- 操作系统:Ubuntu 20.04
➡➡➡Minimalist reproduce repo in here
1。项目结构
我创建了一个极简的 TypeScript 项目,其结构如下所示:
. // Project root directory ($PWD)
├── dist
│ └── main.js // output file
├── Makefile
├── package.json
├── package-lock.json
├── src
│ ├── main.ts
│ └── types
│ └── window.d.ts // ←extends some properties to `global.Window`
└── tsconfig.json
2.自定义界面 global.Window
我扩展了一些附加在内置 Window
全局接口上的自定义属性:
// window.d.ts
export { } // to solve TS2669,see https://stackoverflow.com/questions/57132428/augmentations-for-the-global-scope-can-only-be-directly-nested-in-external-modul
declare global {
interface OurDefinedGlobalRuntimeEnv {
/** Runtime value (Defined in preload.js)
* - `web`: Ordinary web browser.
* - `electron`: Electron renderer window.
*/
broWSER: 'electron' | 'web' | undefined
SERVER_IP: string
DEBUG: string
NODE_ENV: node_env_t,}
type node_env_t = 'production' | 'development'
interface Window {
__RUNTIME_ENV__: OurDefinedGlobalRuntimeEnv
}
}
然后将我们自定义的对象注入到window
中:
// main.ts
type inferPropType<T,K extends keyof T> = T[K]
const rtenv1: inferPropType<Window,'__RUNTIME_ENV__'> = {
broWSER: 'electron',NODE_ENV: process.env.NODE_ENV === 'development' ? 'development' : 'production',SERVER_IP: process.env.SERVER_IP || '',DEBUG: process.env.DEBUG || '',ENV_VAR: process.env,}
const rtenv2: OurDefinedGlobalRuntimeEnv = rtenv1
window.__RUNTIME_ENV__ = rtenv1
3. VSCode 智能感知和tsc
到目前为止,VSCode 的 IntelliSense 没有输出任何错误或警告,并且 IntelliSense 可以正确推断类型:
并以项目的根路径为 tsc
运行 $CWD
:
cd PROJECT_ROOT_DIR
npx tsc --outDir ./dist/ --module commonjs ./src/*.ts
4.问题出在哪里?
调试> 7 小时后,我发现tsc
在要编译的文件和*.d.ts
不在同一文件夹中时无法检测到*.d.ts
/strong>。也就是说,如果移动window.d.ts
:
.
└── src
├── main.ts
└── types
└── window.d.ts
变成这样:
.
└── src
├── main.ts
└── window.d.ts
现在tsc
编译通过:
npx tsc --outDir ./dist/ --module commonjs ./src/*.ts
5.问题
- 在TypeScript官方文档中,好像自己定义的
*.d.ts
可以放在项目的任意子文件夹中? - VSCode 的 IntelliSense 可以正确加载和推断我们的
*.d.ts
和扩展的全局Window
接口中定义的类型,所以我想我没有错误地编写定义文件......对吧? 立>
我们的 window.d.ts
中定义的类型将被多个条目文件使用,在这种情况下,我不应该将此 window.d.ts
复制到多个文件夹。
(注意:这只是一个重现问题的极简项目,所以我只写了一个入口文件 main.ts
。在现实世界中,这实际上是一个大型 Electron 项目,其中包含其他入口文件,例如preload.js
和 electron_entry.js
以及 Webpack 捆绑的 SPA 条目...等)
-
除非我使用
tsc --outDir OUT_DIR SRC_FILE
或仅使用${PWD}/tsconfig.json
(将根据tsc --project ./tsconfig.json
编译所有内容),否则tsc
是否总是忽略tsconfig.json
?我想知道我是否可以直接通过.ts
在特定的tsc XXXX...
文件上构建 ** 而无需创建多个tsconfig.json
或通过webpack
。 -
虽然我发现使用
tsc
(没有任何参数)可以成功编译(它隐式加载tsconfig.json
),但我不知道它是如何成功的,也不知道{{1}中的哪个选项}} 使其成功...即使使用参数tsconfig.json
仍然无法加载--baseUrl . --rootDir . --moduleResolution Node --module commonjs
。 `