最佳化套件導入 (optimizePackageImports)
有些套件可能會匯出數百或數千個模組,這可能會導致開發和生產環境中的效能問題。
將套件新增至 experimental.optimizePackageImports
將只會載入您實際使用的模組,同時仍然讓您可以方便地撰寫具有許多具名匯出的 import 陳述式。
next.config.js
module.exports = {
experimental: {
optimizePackageImports: ['package-name'],
},
}
以下函式庫預設已最佳化
lucide-react
date-fns
lodash-es
ramda
antd
react-bootstrap
ahooks
@ant-design/icons
@headlessui/react
@headlessui-float/react
@heroicons/react/20/solid
@heroicons/react/24/solid
@heroicons/react/24/outline
@visx/visx
@tremor/react
rxjs
@mui/material
@mui/icons-material
recharts
react-use
@material-ui/core
@material-ui/icons
@tabler/icons-react
mui-core
react-icons/*
這有幫助嗎?