Vite2 + React + Antd 踩坑指南

轉(zhuǎn)載請(qǐng)注明出處,點(diǎn)擊此處 查看更多精彩內(nèi)容。

process is not defined

報(bào)錯(cuò):

Uncaught ReferenceError: process is not defined

解決方案:

// 使用 import.meta.env 替換 process.env
process.env --> import.meta.env
# .env

# 字段名必須以 VITE_ 開頭,否則不會(huì)暴露到 import.meta.env 中
VITE_APP_VERSION = "1.0.0"

Property 'env' does not exist on type 'ImportMeta'

報(bào)錯(cuò):

Property 'env' does not exist on type 'ImportMeta'

解決方案:

# tsconfig.json

{
  "compilerOptions": {
    "types": ["vite/client"],
    ...
  }
}       

_interopRequireDefault is not a function

報(bào)錯(cuò):

Uncaught TypeError: _interopRequireDefault is not a function
    at Form.js:24
    at chunk.2VCUNPV2.js?v=9e816b32:4
    at dep:antd_lib_form_Form:1

解決方案:

// useForm 從錯(cuò)誤的包導(dǎo)入,導(dǎo)致報(bào)錯(cuò)
// import { useForm } from 'antd/lib/form/Form'
// import { useForm } from 'antd/es/form/Form'
// const [form] = useForm()

// 通過 Form 調(diào)用,不會(huì)出現(xiàn)導(dǎo)包錯(cuò)誤的問題
import { Form } from 'antd'
const [form] = Form.useForm()

global is not defined

報(bào)錯(cuò):

Uncaught ReferenceError: global is not defined
    at setImmediate.js:15
    at chunk.2VCUNPV2.js?v=e11687d4:4
    at editOnBeforeInput.js:25
    at chunk.2VCUNPV2.js?v=e11687d4:4
    at DraftEditorEditHandler.js:16
    at chunk.2VCUNPV2.js?v=e11687d4:4
    at DraftEditor.react.js:32
    at chunk.2VCUNPV2.js?v=e11687d4:4
    at Draft.js:24
    at chunk.2VCUNPV2.js?v=e11687d4:4

解決方案:

<!-- index.html -->

<html>
  ...
  <body>
    <script>
      global = globalThis
    </script>
    ...
  </body>
</html>
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容