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中实现组件跟随鼠标位置弹出效果,本文通过图文示例代码相结合给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-02-02
  • node.js开发辅助工具nodemon安装与配置详解

    node.js开发辅助工具nodemon安装与配置详解

    node.js代码修改后,需要重新启动 Express 应用,所做的修改才能生效。若之后的每次代码修改都要重复这样的操作,势必会影响开发效率,本文将详细介绍Nodemon,它会监测项目中的所有文件,一旦发现文件有改动,Nodemon 会自动重启应用
    2020-02-02
  • 浅谈在Vue.js中如何实现时间转换指令

    浅谈在Vue.js中如何实现时间转换指令

    这篇文章主要介绍了浅谈在Vue.js中如何实现时间转换指令,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-01-01
  • Vue组件通信之父传子与子传父深入探究

    Vue组件通信之父传子与子传父深入探究

    对于vue来说,组件之间的消息传递是非常重要的,用vue可以是要组件复用的,而组件实例的作用域是相互独立,这意味着不同组件之间的数据无法互相引用,一般来说,组件之间可以有几种关系,下面是我对组件之间消息传递的常用方式的总结
    2022-12-12
  • 在vant中使用时间选择器和popup弹出层的操作

    在vant中使用时间选择器和popup弹出层的操作

    这篇文章主要介绍了在vant中使用时间选择器和popup弹出层的操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • uniapp 获取系统信息的方法小结

    uniapp 获取系统信息的方法小结

    uni-app提供了异步(uni.getSystemInfo)和同步(uni.getSystemInfoSync)的2个API获取系统信息,系统信息返回的内容非常多,各操作系统、各家小程序、各浏览器对它们的定义也不相同
    2022-11-11
  • Uniapp+Vue3树形选择器示例代码

    Uniapp+Vue3树形选择器示例代码

    文章主要介绍了使用UniApp+Vue3进行跨平台应用开发的优势,包括性能提升、开发体验优化、多端适配能力以及官方支持和生态完善,通过示例代码展示了如何利用该组合进行高效开发,感兴趣的朋友跟随小编一起看看吧
    2026-04-04
  • Vue3中使用富文本编辑器的示例详解

    Vue3中使用富文本编辑器的示例详解

    有不少的前端需求都需要使用到富文本编辑器,所以这篇文章主要来和大家介绍一下如何在Vue3项目中使用富文本编辑器,感兴趣的可以了解下
    2024-04-04
  • vue+vant实现购物车全选和反选功能

    vue+vant实现购物车全选和反选功能

    这篇文章主要为大家详细介绍了vue+vant实现购物车全选和反选功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-11-11
  • Uniapp中WebView的使用与后退键处理教程

    Uniapp中WebView的使用与后退键处理教程

    在Uniapp中使用web-view组件来加载H5页面时,对于后退键的处理是一个常见需求,下面这篇文章主要给大家介绍了关于Uniapp中WebView的使用与后退键处理的相关资料,需要的朋友可以参考下
    2024-07-07

最新评论