“不能在模塊外使用 import 語句” - JavaScript 模塊導入到 TypeScript 文件中，JavaScript 模塊內有其他導入

Question

為了進一步解釋，可以想象我有一組 JavaScript 模塊，這些模塊是從一個初始模塊觸發的，該模塊被導入到 Angular 組件中。

我試過的：

I am using "type": "module" in the package.json file and have declared all scripts as modules in a typings file, I have also declared them under scripts in angular.json. 我將腳本設置為 index.html 中的模塊，但我仍然收到“未捕獲的語法錯誤：無法在模塊外使用導入語句”。

發生錯誤時：

該錯誤來自初始 JavaScript 模塊中的第一個導入語句，例如第 1 行。

導入語句在最初的 JavaScript 模塊中看起來像這樣，隨后對其他腳本的語句，所有這些都會觸發相同的問題。

import * as objParser from './scripts/objParser.js'

我可以確認問題不在於代碼邏輯，因為代碼確實在開發模式下工作，但當然，我無法將其作為生產 package 運行。

也許是問題？

我的想法是 Angular 沒有將這些 JavaScript 文件驗證為模塊，因為它們不使用 Angular 代碼庫中的導入。 有任何想法嗎？

Answer 1

使用const objParser = require('./scripts/objParser.js'); .

Answer 2

您可以在腳本文件夾中創建一個index.ts文件，該文件將允許您從該文件導入所有模塊。

您將它們添加到index.ts中，例如

export * from './scripts/objParser.js';

然后你可以像導入

import { ObjParser } from './scripts'

如果它不兼容，可能是因為它們不是 typescript 庫。