【VUE】process.env，require，vite.config.js等问题的解决

问题产生的原因：1.用vite进行项目构建。2.部分使用的是以前迁移过来的vue2的代码。3.npm及node更新版本之后出现的区别。

问题1：process.env找不到（process is not defined）

问题描述：在vue2中可以使用process.env，但vue3中不再使用。
问题解决：在vite.config.js中添加define: { 'process.env': {} },即可解决
图片：

参考：https://blog.csdn.net/henryhu712/article/details/117897998

---

问题2：require找不到

问题描述：js文件中使用const path = require('path');时，require找不到。
问题解决1：npm install @types/node --save-dev
问题解决2：在这一处具体问题处，可以把const path = require('path');换成import path from "path"
问题原因：并不百分百确定，但我认为可以采信的原因是因为vue3的环境都是ts的环境了，而require需要的node环境，所以切换到vue3之后无法直接使用。虽然在vite创建项目的时候，我选的是js而不是ts，但是vue3本身是ts重构过了的。如果你本身创建项目时使用的就是ts，那么有网友称还需要配置tsconfig.json，在里面加入

{
    "compilerOptions": {
    	// ...
        "types": ["node"],
        // ...
}

参考：https://blog.csdn.net/qq_31393401/article/details/86235923

https://blog.csdn.net/qq_38735649/article/details/95939794

问题3：resolve.alias路径别名的使用

问题描述：使用vite.config.js使用alias提示应使用resolve.alias
问题解决：

resolve:{
    alias: {
      '@': path.resolve(__dirname, 'src')
    }
  },

图片：

补充：这一步要实现，需要导入path，也即import path from "path"

参考：https://blog.csdn.net/yusirxiaer/article/details/115440738

---

问题4：vite.config.js中export default显示为灰色，提示unused export default

问题描述：如题
问题解决：没有关系，实际生效了，如果没生效项目重启一下。可以通过修改配置的server的port来观察启动接口有没有改变从而判断vite.config.js有没有启用。