typescript 導入導出中的持續未定義錯誤

Question

在多個文件中已經有很多關於 typescript 的問題.. 例如，這個，

Typescript 導入/導出

有趣的問題和答案，我簡化並測試了它，見下文.. 但無論我嘗試什么，我仍然得到

未捕獲的類型錯誤：無法讀取未定義的屬性（讀取“A”）

.. 與我在網上找到的 TypeScript 中的任何其他導入/導出示例一樣。 無論我做什么，無論 object 我嘗試使用或不使用模塊的 export (class, function, const)：我都會遇到同樣的錯誤。

也許我的 NPM/TSC/React 配置有問題？ 當我想在一個項目中使用多個 typescript 文件時，我應該更改例如 tsconfig.js 嗎？ 我迷路了，我錯過了什么？

tsconfig.json

{ // TypeScript configuration file: provides options to the TypeScript 
  // compiler (tsc) and makes VSCode recognize this folder as a TS project,
  // enabling the VSCode build tasks "tsc: build" and "tsc: watch".
  "compilerOptions": {
   "target": "es5",            // Compatible with older browsers
   "module": "umd",            // Compatible with both Node.js and browser
   "moduleResolution": "node", // Tell tsc to look in node_modules for modules
   "sourceMap": true,          // Creates *.js.map files
   "jsx": "react",             // Causes inline XML (JSX code) to be expanded
   "strict": true,             // Strict types, eg. prohibits `var x=0; x=null`
   "alwaysStrict": true        // Enable JavaScript's "use strict" mode
  },
 "include": ["**/*.ts", "**/*.tsx"],
 "exclude": ["node_modules"] 

}

第一個.tsx

const A ={
  val: 'A'
}    
export { A }

應用程序.tsx

import { A } from "./first";

// ... other code

function reportPerson()
{
  console.log(A);
}

.. 兩個文件都使用 TSC 轉換為 .js，但 Google Chrome 控制台將 A 報告為未定義，

兩個 tsx 文件都在同一個目錄中，TSC 將它們都轉換為 JS 沒有任何問題。

這是怎么回事？

Answer 1

感謝大家的建議（我也沒有解決上面的最小示例..）

為了正確地將我的東西鏈接在一起，我現在讓Parcel 2工作，

https://www.npmjs.com/package/parcel

npm i parcel

這基本上是一個捆綁器，它允許在將單獨的 ts 文件編譯為 Javascript 后將它們連接起來，並將所有內容放在 \dist 目錄中，

parcel build src/index.html

基於一個小的反應示例，我將我的第一個“模塊化”小應用程序放在 TypeScript 中工作。 然后，在專家建議的幫助下，我繼續使用 twgl.js，這是一個很棒的 Webgl2 工具包。

npm install twgl.js

這個 javascript 庫甚至有子模塊.. 現在一切都很好，我可以訪問（全部？）twgl

import * as twgl from "./twgl-full.js";