VSCode 智能感知 - 解析动态 JS 变量

Question

我有一个依赖于环境变量的对象，因此只能在运行时解析。有没有办法告诉 VSCode 智能感知如何解决它，或者忽略对象的那部分？

示例：

const specInventory = {
  'London': {
     speaker: 'JBL'
  },
};
module.exports = {
  //many other properties
  speaker:'LG',
  ...specInventory[process.env.LOCATION]
};

导入此模块后，我无法“定义”此文件/对象的任何属性，这是有道理的，因为智能感知不知道我的属性是什么（代码运行时一切都按预期工作）

我知道 JSDoc 评论。对于较大的文件，该解决方案似乎并不方便。即使我自动生成评论，我也不能确定我的同事会...

有什么方法可以告诉 Intellisense 转到属性的默认声明、忽略覆盖或其他任何内容以便能够导航到此文件吗？

...specInventory[process.env.LOCATION] //intellisense-ignore-line.. :D

附注环境变量在 .env 文件中声明，如果有什么区别的话......

提前谢谢您

Answer 1

我们处理这个问题的一种方法是使用 JSDoc 注释告诉 IntelliSense 我们期望属性访问

specInventory[process.env.LOCATION]

返回什么。

扩展你的例子：

const specInventory = {
  'London': {
     speaker: 'JBL'
  },
};

/** @type {specInventory[keyof specInventory]} */
const locationSpecInventory = specInventory[process.env.LOCATION];

module.exports = {
  //many other properties
  speaker:'LG',
  ...locationSpecInventory
};

这告诉 IntelliSense

locationSpecInventory

的类型将是

specInventory

的子属性之一。当在另一个文件中需要此模块时，我能够看到

speaker

的类型为“字符串”。

感谢这个答案的

obj[keyof obj]

聪明，这实际上是对象的“valueof”。

---

另一种选择是使用

JSDoc 类型转换

来明确说明 process.env.LOCATION 是什么。

const specInventory = {
  'London': {
     speaker: 'JBL'
  },
};

const location = /** @type {'London'} */ (process.env.LOCATION);

module.exports = {
  //many other properties
  speaker: 'LG',
  ...specInventory[location]
};

如果您只有几个位置，或者想要重点关注

.env

文件中的一个位置，这可能就很好，但如果您有一堆位置，则另一种方法可能更适合。