Comments (7)
It shouldn't break because of that tho, we'll investigate. Thanks for raising that and happy that it works now :)
from analytics.
Upgraded to 13.4.1 this morning and it seems to be resolved. I literally haven't changed anything else since, so I'm still not sure what was conflicting, but it doesn't seem to be an issue now.
from analytics.
Hey!
Have you tried it adding it before the closing </body>
? Let me know if that helps :)
export default function RootLayout({ children }) {
return (
<html lang="en" className={`${obidee_sans.variable} ${ubuntu.variable}`}>
{/*
<head /> will contain the components returned by the nearest parent
head.jsx. Find out more at https://beta.nextjs.org/docs/api-reference/file-conventions/head
*/}
<head />
<body>
<div className="app_grid" id="root">
<ScrollToTop />
<GridHeader />
<GridRightHeader />
<div id="app_grid_content" className="app_grid_content">
{children}
<Footer />
</div>
</div>
<Analytics />
</body>
</html>
);
}
from analytics.
doh! that totally fixed it. thank you! :)
I don't know why I fixated on the "add it after {children}" instead of "add it right before </body>
". Not enough caffeine methinks.
Thank you very much, sorry to bother you with something so simple! :)
from analytics.
Ok, that isn't a 100% fix. If I reload the page, the fonts work. But if I navigate from page to page the fonts suddenly stop working. If I reload the page it fixes again ... until I navigate around.
from analytics.
Hey @Keltin42
I'm not sure if the <Analytics/>
component component can cause that behaviour. Do you have a deployment URL where we can reproduce this?
What next.js version are you using?
from analytics.
Ok, I tried a preview deployment and I don't see the issue, but I do still see it in when I run on localhost. You can see both browsers here, look at the "ROAR!" title.
Preview Deployment (with this change): https://roar-stage.keltin.net/
Production build (without this change, and back at 13.1 I think, I upgraded everything this morning hoping to fix this issue): https://roar.keltin.net
package.json
{
"name": "roar-web",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@next/font": "13.3.4",
"@vercel/analytics": "^1.0.1",
"eslint": "8.39.0",
"eslint-config-next": "13.3.4",
"firebase-admin": "^11.5.0",
"next": "13.3.4",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-modal": "^3.16.1",
"react-select": "^5.7.0"
}
}
What I see in the debugger is that the css variable definitions (shown here) disappear.
Ok, this is driving me nuts, because as soon as I popped open the debugger to grab a screenshot of them missing, the fonts fixed themselves again. It's like the analytics events are sometimes destroying/blocking those two css variables.
from analytics.
Related Issues (20)
- Error 400 when using analytics/server track in server actions HOT 2
- Vercel build failed with Turborepo and multiple apps deployed HOT 5
- Vercel Analytics Endpoints HOT 1
- Docs: Specify if `track` runs in development mode or not HOT 1
- Page changes are no longer tracked in SvelteKit 2 HOT 9
- Feature Request: Allow nonce as optional prop in analytics component for content security policy HOT 1
- Integration with Docusaurus HOT 1
- Module resolution warnings under Yarn PnP: `Unable to resolve path to module '@vercel/analytics/react'.eslintimport/no-unresolved` HOT 5
- City-Level analytics HOT 3
- CJS files are missing in 1.2.0 HOT 10
- Feature request: Exports HOT 3
- Cannot install the latest version of `@vercel/analytics` with `[email protected]` HOT 2
- Vercel Analytics being blocked by AdBlockers HOT 1
- SvelteKitError: Not found: /_vercel/insights/script.js with playwright/test HOT 2
- Use process.env.ASSET_PREFIX when sending tracking data #63 HOT 1
- Version Compatibility
- CORS errors HOT 1
- script.js doesn't load with Next.js Dyamic Routes? [Error on build only] HOT 2
- unclear how to view and export custom events + properties? HOT 1
- Access-Control-Allow-Origin header won't attached when reverse-proxying
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from analytics.