vue3 - 类型“ImportMeta”上不存在属性“env”？

Question

背景：
vue3+vite项目需要用环境变量，所以有如下代码：
ts文件：

，存在编译报错

尝试: 在tsconfig.json下添加"types": ["vite/client"]

仍然有编译报错

Answer 1

首先，让我们解决你的问题。

你遇到的编译错误是因为在 TypeScript 中，ImportMeta 类型并没有 env 属性。ImportMeta 是一个内置的模块，它提供了与模块的元数据相关的信息。然而，它并没有 env 属性。

如果你想在 Vue 3 + Vite 项目中使用环境变量，你可以考虑使用 vite 提供的内置插件来管理环境变量。vite 允许你在 vite.config.js 文件中使用 defineConfig 函数来定义环境变量。

下面是一个示例：

// vite.config.jsexport default defineConfig(({ command, mode }) => {  return {    env: {      VITE_APP_TITLE: 'My Vue 3 App', // 在这里定义环境变量    },  };});

然后，你可以在你的 Vue 组件或其他文件中使用 process.env.VITE_APP_TITLE 来访问该环境变量的值。

请确保你正确安装了 vite 的依赖项，并且你的项目结构符合 vite 的要求。如果你仍然遇到问题，请提供更多关于你的项目配置和代码的详细信息，以便我可以更好地帮助你解决问题。