search

3lang3 / react-vant

React mobile UI Components base on Vant
https://react-vant.3lang.dev
MIT License
1.31k stars 186 forks source link

🐛 [Bug]: React 18 + Next 13 樣式無法載入問題 #646

Closed music1353 closed 1 year ago

music1353 commented 1 year ago

Which React Vant packages are impacted?

What version of React Vant are you using?

3.2.7

Reproduce live demo(codesandebox or stackblitz)?

No response

Descripition

開發環境：Next 13 (app dir) 描述：安裝完 react-vant 後，先測試一下引入 Button，但沒有載入樣式，只呈現原始 html 樣式

另外想請問，react-vant 會與 tailwind 及 scss 互相衝突嗎？

3lang3 commented 1 year ago

@music1353 可以参照nextjs demo, 对于使用服务器组件的，可能需要声明 'use client';

不会和 tailwind 和 scss 互相冲突，受css规则影响

music1353 commented 1 year ago

@3lang3 nextjs demo 是 Next 12 版本，不確定是不是 Next 13 (app dir) 會無法載入樣式，另我也有聲明 'use client'

3lang3 commented 1 year ago

在 src/app/layout.tsx 下引入css

import 'react-vant/lib/index.css'

引入rv的页面或者组件需要申明 'use client'

music1353 commented 1 year ago

我發現把 app dir 換回 src/app 就可以了 謝謝您的回答！