javascript - path.scope.bindings 是否仅包含源代码中的变量，而不包含在 babel 转换时动态插入的变量？

Question

在使用 babel 插件编译我的代码时，我试图插入一个 import 语句。该语句可能会被多次动态插入，所以我必须确保它之前没有被插入。

我曾经path.scope.hasOwnBinding并且path.scope.hasBinding确保它们不会与现有的冲突，但它不适用于动态插入变量。

const conditions = ['view', 'text'];
function Plugin({types: t, template}) {
  return {
    visitor: {
      ImportDeclaration(path, state) {
        var node = path.node;
        var sourceValue = node.source.value;

        conditions.forEach(item => {
          if (name === sourceValue) {
            // multi insert
            if (!path.scope.hasOwnBinding("AsyncComp") && !path.scope.hasBinding("AsyncComp")) {
              const myImport = template(`import AsyncComp from "../src/";`, { sourceType: "module" });
              path.insertAfter(myImport());
            }
            if (path.scope.hasOwnBinding("AsyncComp")) {
              // never execute
            }
            if (path.scope.hasBinding("AsyncComp")) {
              // never execute
            }

          }
        });
      }
    }
  }
}

我希望他们可以检测到我之前插入的变量，但遇到的错误消息是Duplicate declaration AsyncComp

Answer 1

你的条件不对

if (!path.scope.hasOwnBinding("AsyncComp") || path.scope.hasBinding("AsyncComp")) {

是!path.scope.hasOwnBinding("AsyncComp") OR ，所以你在返回 true时path.scope.hasBinding("AsyncComp")插入import子句path.scope.hasBinding("AsyncComp")

您需要以下其中一项：

if (!(path.scope.hasOwnBinding("AsyncComp") || path.scope.hasBinding("AsyncComp"))) {

或者

if (!path.scope.hasOwnBinding("AsyncComp") && !path.scope.hasBinding("AsyncComp")) {