I currently use _document.js to inject css into my Next.js app and I would like to start using _app.js to help inject data into pages.
Was wondering if it possible to use _document and _app in tandem or should we only use one or the other?
-
5Here is a comparsion betwen _app.js and _document.js zeit.co/blog/next6#app-component In short you can use both.lependu– lependu2018-06-28 13:20:36 +00:00Commented Jun 28, 2018 at 13:20
Add a comment
|
1 Answer
Short answer: Yes, You can use both. They serve different purpose and can be used in the same application.
According to NextJS docs:
Next.js uses the App component to initialize pages.
To override, create the
./pages/_app.jsfile and override the App class
and
Pages in Next.js skip the definition of the surrounding document's markup. For example, you never include
<html>,<body>, etc. To override that default behavior, you must create a file at./pages/_document.js, where you can extend the Document class.
Note: _document.js is only rendered on the server side and not on the client side. so event handlers like onClick is not going to work.
9 Comments
Borek Bernard
@Webwoman
_app.js is rendered on both server-side and client-side (on the server during the initial SSR, on the client-side after hydration and then on every page/route navigation). _document.js "wraps" _app.js.
wildeyes
Where's the documentation for _app?
1thrasher
It would appear
_app.js is only mentioned in the 'Learn' section here: nextjs.org/learn/basics/assets-metadata-css/global-styles Note: you will need to restart your server after adding it.
cobrexus
@mangrove108 it will work, I don't know what you mean by "safe". I wouldn't advise you to inject confidential information there since it will be visible to the client, but why would you want to access
process.env from _document.js? |