WebStorm：什么是“元素未导出”警告？

在使用WebStorm进行前端开发时，您可能会遇到“元素未导出”这样的警告。这个警告通常会在您使用ES6模块或CommonJS模块系统时出现。

什么是“元素未导出”警告？

当您在一个模块中引用另一个模块的导出时，如果被引用的导出不存在，则会出现“元素未导出”警告。例如，假设您有一个名为moduleA.js的模块和一个名为moduleB.js的模块。

// moduleA.js
export const foo = 'foo';

// moduleB.js
import { bar } from './moduleA';

在上面的示例中，当您尝试在moduleB.js中导入一个名为bar的变量时，由于moduleA.js中没有导出这样的变量，因此将出现“元素未导出”警告。

如何解决“元素未导出”警告？

要解决“元素未导出”警告，请确保您正在导出正确的变量或函数，并且名称与导入中指定的名称匹配。如果您使用的是ES6模块，则必须将变量或函数显式导出。

// moduleA.js
export const foo = 'foo';
export const bar = 'bar';

// moduleB.js
import { bar } from './moduleA'; // 正确
import { baz } from './moduleA'; // 错误：未导出'baz'

如果您使用的是CommonJS模块，则可以使用module.exports将变量或函数导出。

-- -------------------- ---- -------
-- ----------
-------------- - -
  ---- ------
  ---- -----
--

-- ----------
----- - --- - - --------------------- -- --
----- - --- - - --------------------- -- -----------
展开代码

结论

“元素未导出”警告表示您尝试导入一个不存在的变量或函数。要解决此问题，请确保您正在正确地导出变量或函数，并且名称与导入中指定的名称匹配。理解模块系统的工作原理非常重要，因为它是现代JavaScript应用程序的基础之一。通过遵循最佳实践和规范，您可以编写模块化、可维护和可扩展的代码。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/31434