Vite3 Svelte3构建Web应用报错process is not defined

 更新时间:2023年06月14日 10:16:26   作者:天問  
这篇文章主要介绍了Vite3 Svelte3构建Web应用报错:'process is not defined'解决方法详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

正文

Vite爬坑日记: 在使用 Vite3 + Svelte3 构建 Web 应用时,控制台报错:process is not defined

Vite

问题原因

Viteprocess.env 全局环境变量被移除了,相当于 process.env = null,如果项目中有依赖 process.env 这个对象,并进行了 get/set 操作时就会出现报错。

解决办法

  • vite.config.js 配置文件中增加 define: { "process.env": {} }
import { defineConfig, loadEnv } from "vite";
import { svelte } from "@sveltejs/vite-plugin-svelte";
import sveltePreprocess from "svelte-preprocess";
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    svelte({
      preprocess: sveltePreprocess(),
    }),
  ],
  define: {
    "process.env": {}
  }
})

PS: 这里涉及到 Vite3 配置 / 共享选项 中的 define 变量。官网地址

define类型: Record<string, string>

定义全局常量替换方式。其中每项在开发环境下会被定义在全局,而在构建时被静态替换。

以上就是Vite3 Svelte3构建Web应用报错process is not defined的详细内容,更多关于Vite3 Svelte3构建Web报错的资料请关注脚本之家其它相关文章!

相关文章

  • vue使用节流函数的踩坑实例指南

    vue使用节流函数的踩坑实例指南

    防抖和节流的目的都是为了减少不必要的计算,下面这篇文章主要给大家介绍了关于vue使用节流函数踩坑的相关资料,需要的朋友可以参考下
    2021-05-05
  • 详解基于mpvue微信小程序下载远程图片到本地解决思路

    详解基于mpvue微信小程序下载远程图片到本地解决思路

    这篇文章主要介绍了详解基于mpvue微信小程序下载远程图片到本地解决思路,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-05-05
  • 几分钟弄懂Vuex的五大属性和使用方式

    几分钟弄懂Vuex的五大属性和使用方式

    这篇文章主要介绍了几分钟弄懂Vuex的五大属性和使用方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-10-10
  • vue3使用ref的性能警告问题

    vue3使用ref的性能警告问题

    这篇文章主要介绍了vue3使用ref的性能警告问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-04-04
  • Vue自定义名称下载PDF的方法

    Vue自定义名称下载PDF的方法

    这篇文章主要介绍了Vue自定义名称下载PDF,本文通过示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-08-08
  • 在Vant的基础上封装下拉日期控件的代码示例

    在Vant的基础上封装下拉日期控件的代码示例

    这篇文章主要介绍了在Vant的基础上封装下拉日期控件的代码示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-12-12
  • vue init webpack 项目初始化失败问题

    vue init webpack 项目初始化失败问题

    在使用Vue-cli搭建项目时,可能会遇到依赖无法显示版本号的问题,首先检查环境变量配置是否正确,确保vue-init的安装目录被正确添加到path中,若问题仍未解决,尝试卸载并重新安装webpack,确保在正确的项目路径下执行npm install和npm run dev命令
    2024-09-09
  • vue+js实现微信上传图片选择功能

    vue+js实现微信上传图片选择功能

    这篇文章主要为大家详细介绍了vue+js实现微信上传图片选择功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • vue2.0+vue-dplayer实现hls播放的示例

    vue2.0+vue-dplayer实现hls播放的示例

    这篇文章主要介绍了vue2.0+vue-dplayer实现hls播放的示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-03-03
  • 通过vue如何设置header

    通过vue如何设置header

    这篇文章主要介绍了通过vue如何设置header,每个项目都有头部但是内容不一样;这种情况我们可以考虑在app.vue中创建公共头部,那么怎么配置公共头部header,下面小编通过实例代码详细讲解,需要的朋友可以参考下
    2023-02-02

最新评论