next.js 踩坑筆記

1、nginx轉發：

location / {
    proxy_pass http://localhost:3000;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
    proxy_set_header Host $host;
    proxy_cache_bypass $http_upgrade;
}
複製程式碼

2、靜態資源和輸出目錄不一致問題，修改構建輸出目錄：

// next.config.js
module.export = {
    distDir: '_next'
}
複製程式碼

3、字型檔案載入 next-plugins：

npm install next-fonts

// next.config.js
const withFonts = require('next-fonts');
module.export = withFonts({
    ...
});
複製程式碼

4、非同步載入的js，全域性變數需要加判斷，否則會閃一下錯誤資訊，例如Google Analytics：

<script async src="https://www.googletagmanager.com/gtag/js"></script>

if (typeof gtag !== "undefined"){
    gtag("event", name, {event_category: category});
}
複製程式碼