关于Vue3+ts引入文件使用alias别名@时报错问题，process is not defined

浪里小韭菜

于 2023-03-17 10:44:00 发布

阅读量703

点赞数

文章标签： vue.js javascript 前端 ecmascript 前端框架

本文链接：https://blog.youkuaiyun.com/qq_38828542/article/details/134052223

版权

文章讲述了如何解决Vite项目中的路径配置问题，包括确保有tsconfig.json和vite.config.ts文件，设置tsconfig.json中的paths别名，以及在vite.config.ts中配置路径别名。同时，针对processisnotdefined的错误，提出了将process.env替换为import.meta.env的解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如题，解决办法：

一、首先确保有两个文件：

tsconfig.json

vite.config.ts(注：如果是vue.config.js，则手动改为vite.config.js)

二、在ts.config.json中修改

{
  "compilerOptions": {
    ......
    "paths": {
      "@/*": ["src/*"]
    }
  }
}

三、在vite.config.ts中修改

export default defineConfig({
  ....
  resolve: {
    // 别名
    resolve: {
      // Vite路径别名配置
      alias: {
        '@': path.resolve('./src')
      }
    }
   ...
  },
});

四、关于 process is not defined 报错问题

process.env 已经废弃，改为 import.meta.env