Một số lỗi và issue khi chạy snowpack build or dev

1.Module not found: Error: Can't resolve

[error] ./_dist_/components/Meeting/Home/hooks/useMeeting.js
Step #1:   Module not found: Error: Can't resolve '../../Fullcalendar/Actions/meeting.js' in '/workspace/.build/_dist_/components/Meeting/Home/hooks'
Step #1:   resolve '../../Fullcalendar/Actions/meeting.js' in '/workspace/.build/_dist_/components/Meeting/Home/hooks'

Lỗi này snowpack không thể tìm được thư file của bạn, có thể do file được gọi thuộc cấp folder thấp hơn hoặc bằng so với file đích gọi, và thuộc 2 thư mục khác nhau. Cách xử lý: Đưa file được gọi ra cấp thư mục cha hoặc anh em của file gọi. ở ví dụ này, tôi move folder Actions ra ngoài thư mục chứa Fullcalendar và thư mục Home, nằm ngang hàng với 2 thư mục trên.

2.Error] BABEL Note: The code generator has deoptimised the styling of

error] [BABEL] Note: The code generator has deoptimised the styling of /workspace/.build/web_modules/lodash.js as it exceeds the max of 500KB.
Step #1:   [error] [BABEL] Note: The code generator has deoptimised the styling of /workspace/.build/web_modules/firebase/firestore.js as it exceeds the max of 500KB.

Lỗi này xuất hiện khi build package vượt quá dung lượng 500kb, không ảnh hưởng đến việc deploy Cách xử lý: chưa tìm ra, mức độ ưu tiên

3.Error 404

 [error] [404] /resources/icons/icons-16.woff
    ✘ /Users/DKP090918/Geniam/SnowPackBuild/calendar.geniam.com/public/resources/icons/icons-16.woff

Với những lỗi Error 404, kiểm tra lại đường dẫn path của các file. Một số lỗi về file css.map error 404, có thể do thư viện không import chuẩn map theo yêu cầu của snowpack, để giải quyết vấn đề này, hãy tạo file styles.css và coppy css của thư viện vào file này sau đó Import "./styles.css" như thường lệ, remove các tag /*# sourceMappingURL=[filename].css.map */ nếu có.

4.Uncaught ReferenceError: $RefreshSig$ is not defined

Uncaught ReferenceError: $RefreshSig$ is not defined
    at index-da2cf79d.js:7
    at index-da2cf79d.js:1918
    at createCommonjsModule (_commonjsHelpers-955f0934.js:14)
    at index-da2cf79d.js:4

Type snowpack —reload

5.Uncaught SyntaxError: The requested module ‘/web_modules/XXXXXX.js’ does not provide an export named ‘YYYYYY’

Snowpack tuân theo chiến lược tương tác CJS-ESM của Node.js, trong đó các gói Common.js luôn được xuất sang xuất mặc định ( import react) và không hỗ trợ xuất có tên ( import * as react). Tuy nhiên, nhiều gói ghi lại các bản xuất có tên này trong README của chúng và giả định rằng trình gói của bạn sẽ hỗ trợ nó. Chúng tôi tự động thêm hỗ trợ cho các bản xuất được đặt tên cho một số lượng nhỏ các gói rất phổ biến (như React) sử dụng loại tài liệu này.

Để giải quyết vấn đề này: Thêm gói bị lỗi vào installOptions.namedExportsvà Snowpack sẽ tự động tạo các bản xuất có tên đó cho bạn (lưu ý: bạn có thể cần chạy lại Snowpack có --reloadcờ để áp dụng bản cập nhật này).

// snowpack.config.json
{
  "installOptions": {
    "namedExports": ["someModule"]
  }
}

Chúng tôi sẽ tiếp tục cập nhật các error mới và cách giải quyết!