在React应用程序中,我有一个导入文件,如下所示:
import * as cArrayList from './ClassArrayList'
import * as mCalc1 from './moduleCalc1'
然后在同一个文件中,我有这样的导出:
export const cArrayList.ArrayList
export const mCalc1.doPreCalculationSetup
export const mCalc1.doTheCalculations
但我得到了一个解析错误:标识符"cArrayList"已经声明。
MDN文件在这份声明中说:
import * as myModule from '/modules/my-module.js'
";myModule";当引用导入时,模块对象的别名可以用作一种名称空间,按如下方式使用:
myModule.doAllTheAmazingThings().
那为什么是我的错误呢?
该文件中仅有61条导入行和394条导出行。这个文件的全部目的是只进行一次所有必要的导入,创建一个包含项目中所有可用导出的命名空间。然后,通过引用为使用它们的所有其他模块提供单独的导出,而不是每个模块执行另一个导入。这是为了避免循环引用(我认为(导致程序在启动阶段循环。
更新的
在经历实现nameSpace文件的破解想法的步骤时,我学到了一些让我认为整个练习没有必要的东西。我以为一个循环应用程序实际上是一个停滞的带有gif的启动屏幕。即使认为完成的黑客攻击有效,对之前运行良好的代码进行的许多小更改也引发了问题。我最近的想法是尝试构建并运行,这是关键。该构建失败了,但确定了要更正的失败代码。然后是一系列的小代码更改。
因此,多亏了GIT,我能够回到我第一次看到这个问题的时间点:一个干净的编译,但一个停滞的启动屏幕。现在我运行了一个构建,得到了这个:
Failed to compile.
Failed to minify the code from this file:
./src/calculations/moduleMoneyPlanEntry.js:53:4
那个位置的代码很简单:
function moneyPlanEntry() {
try {
process.env.MONEYPLAN = 'development'
process.env.NODE_ENV = 'development' (A)
问题出在前一项工作中标记为(A(的剩余行上。删除那一行,一切都好。构建运行,并且校正后的代码以";纱线起始";命令所以现在我将放弃我的nameSpace破解并正常继续。关键的教训?偶尔运行一次生成以检查是否存在潜在错误。
@CertainPerformance已经说明了语法错误的一切。
这个文件的全部目的是只进行一次所有必要的导入,创建一个包含项目中所有可用导出的命名空间。然后,通过引用为使用它们的所有其他模块提供单独的导出,而不是每个模块执行另一个导入。
为此,您需要使用export * from '…';
语法。或冲突时为export { name as alias } from '…';
。
但这听起来是一个非常糟糕的想法,因为它将所有内容都放在一个全局命名空间中,这与模块化相反。包的各个部分之间将不再有明确的依赖关系,而只是一个大混乱。
这是一个实验,以避免循环引用(我认为(导致程序在启动阶段循环。
循环依赖关系通常会导致TDZ异常,而不是无限循环。
在全局模块中使用const
声明实际上会使情况变得更糟,您确实需要使用实际别名绑定的重新导出。
为了解决循环依赖性问题(并且不想重构但保留依赖性结构(,您通常需要决定哪个模块应该是循环的入口点,以及模块应该以何种顺序执行,然后在任何模块导入列表中始终严格遵循该顺序。
export const <someIdentifier>
将做两件事情:
- 在名为
someIdentifier
的模块作用域中声明一个局部变量(作为const
( - 将其导出为命名导出
您收到的错误消息有点误导。无论变量是否事先声明,
export const someObject.someProperty
是无效语法,因为someObject.someProperty
不是有效的标识符。出于类似的原因,你不能进行
const someObject.someProperty
对于你想要做的,我会在导出时破坏导入对象的属性,比如:
export const {
doPreCalculationSetup,
doTheCalculations
// you can add more properties here
} = mCalc1;
演示:
<script type="module">
const obj = { foo: 'foo' };
export const { foo } = obj;
console.log(foo);
</script>