NextJS: 06-10 Định nghĩa kiểu dữ liệu cho useAuth

Slide: drive.google.c...
Trong video mình đề cập tới 2 tasks
1. Target to have type suggestion when using profile from useAuth()
2. TIP: Organize Imports (Option + Shift + O)
Mà ở cái task số 2 mình phát hiện có một số vấn đề (sẽ fix ở video 06-13) nhưng mình chia sẻ ở đây trước.
- Đầu tiên là khi optimize import, nó remove luôn dòng import React, cái này OK mn nhen. Vì NextJS 11 mình đang dùng, nó đang sử dụng React 17, mà từ React 17 nó đã chuyển sang dùng jsx transform rồi, ko còn dùng React.createElement() nữa, nên có thể bỏ đi import React. Chi tiết các bạn đọc ở đây nha (reactjs.org/bl...)
- Cái thứ hai là đừng sửa file tsconfig chỗ jsx, vì mình sửa xong thì khi chạy lệnh dev / build ở lần tiếp theo thì nextjs nó cũng override lại cái file tsconfig của mình à, do nó muốn dùng value preserve 😅 Nên mn khỏi sửa nhé.
Túm lại cái task số 2 thì các bạn:
- ko sửa file tsconfig
- và cứ để cho nó remove import React hehe
---
#nextjs
#nextjs_project
#nextjs_tutorial
---
VIDEO CHAPTERS:
Made by: YOUR_NAME_WILL_BE_HERE
Cảm ơn bạn nhiều nhé! ❤️
---
Easy Frontend - Code xịn hơn mỗi ngày
🔥 Khoá học Javascript: course.ezfront...
🎁 Khoá học ReactJS: course.ezfront...
🎯 Fan cứng Easy Frontend: / @easyfrontend
---
💰 Ủng hộ mình làm videos thì đóng góp qua MoMo/ZaloPay: 0901 309 729 nhé
---
Kết nối với mình:
- ✅ Follow facebook: / nvhauesmn
- 🎉 Fan page: / learn.easyfrontend
- ❓ Group: / easyfrontend
- 💻 Github: github.com/pau...
- 💼 LinkedIn: / haunguyenmn

[@kencode2704]

chỗ function useAuth khi thêm UserProfile, thì mình thấy error từ typescript, làm thế nào để fix vậy bạn
const {
data: profile,
error,
mutate,
} = useSWR('/profile', {
dedupingInterval: 60 * 60 * 1000,
revalidateOnFocus: false,
...options,
});
-- Error:
No overload matches this call.
The last overload gave the following error.
Argument of type '{ errorRetryInterval?: number | undefined; errorRetryCount?: number | undefined; loadingTimeout?: number | undefined; focusThrottleInterval?: number | undefined; dedupingInterval: number; ... 22 more ...; isVisible?: (() => boolean) | undefined; }' is not assignable to parameter of type 'Partial'.
Types of property 'fetcher' are incompatible.
Type 'BareFetcher | undefined' is not assignable to type 'BareFetcher | undefined'.
Type 'BareFetcher' is not assignable to type 'BareFetcher'.
Type 'unknown' is not assignable to type 'UserProfile | null'.ts(2769)