Skip to content

Commit

Permalink
Stop using environment variables in pages/_document
Browse files Browse the repository at this point in the history
  • Loading branch information
@devknoll
devknoll committed Nov 30, 2021
1 parent 0ef8739 commit 84645cf
Show file tree
Hide file tree
Showing 5 changed files with 87 additions and 80 deletions.
4 changes: 4 additions & 0 deletions packages/next/export/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -381,6 +381,10 @@ export default async function exportApp(
// Exported pages do not currently support dynamic HTML.
supportsDynamicHTML: false,
concurrentFeatures: nextConfig.experimental.concurrentFeatures,
crossOrigin: nextConfig.crossOrigin,
optimizeCss: nextConfig.experimental.optimizeCss,
optimizeFonts: nextConfig.optimizeFonts,
optimizeImages: nextConfig.experimental.optimizeImages,
}

const { serverRuntimeConfig, publicRuntimeConfig } = nextConfig
Expand Down
148 changes: 68 additions & 80 deletions packages/next/pages/_document.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,7 @@ function getPolyfillScripts(context: HtmlProps, props: OriginProps) {
buildManifest,
devOnlyCacheBusterQueryString,
disableOptimizedLoading,
crossOrigin,
} = context

return buildManifest.polyfillFiles
Expand All @@ -62,15 +63,15 @@ function getPolyfillScripts(context: HtmlProps, props: OriginProps) {
key={polyfill}
defer={!disableOptimizedLoading}
nonce={props.nonce}
crossOrigin={props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN}
crossOrigin={props.crossOrigin || crossOrigin}
noModule={true}
src={`${assetPrefix}/_next/${polyfill}${devOnlyCacheBusterQueryString}`}
/>
))
}

function getPreNextScripts(context: HtmlProps, props: OriginProps) {
const { scriptLoader, disableOptimizedLoading } = context
const { scriptLoader, disableOptimizedLoading, crossOrigin } = context

return (scriptLoader.beforeInteractive || []).map(
(file: ScriptProps, index: number) => {
Expand All @@ -82,7 +83,7 @@ function getPreNextScripts(context: HtmlProps, props: OriginProps) {
defer={!disableOptimizedLoading}
nonce={props.nonce}
data-nscript="beforeInteractive"
crossOrigin={props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN}
crossOrigin={props.crossOrigin || crossOrigin}
/>
)
}
Expand All @@ -100,6 +101,7 @@ function getDynamicChunks(
isDevelopment,
devOnlyCacheBusterQueryString,
disableOptimizedLoading,
crossOrigin,
} = context

return dynamicImports.map((file) => {
Expand All @@ -114,7 +116,7 @@ function getDynamicChunks(
file
)}${devOnlyCacheBusterQueryString}`}
nonce={props.nonce}
crossOrigin={props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN}
crossOrigin={props.crossOrigin || crossOrigin}
/>
)
})
Expand All @@ -131,6 +133,7 @@ function getScripts(
isDevelopment,
devOnlyCacheBusterQueryString,
disableOptimizedLoading,
crossOrigin,
} = context

const normalScripts = files.allFiles.filter((file) => file.endsWith('.js'))
Expand All @@ -148,7 +151,7 @@ function getScripts(
nonce={props.nonce}
async={!isDevelopment && disableOptimizedLoading}
defer={!disableOptimizedLoading}
crossOrigin={props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN}
crossOrigin={props.crossOrigin || crossOrigin}
/>
)
})
Expand Down Expand Up @@ -258,8 +261,14 @@ export class Head extends Component<
context!: React.ContextType<typeof HtmlContext>

getCssLinks(files: DocumentFiles): JSX.Element[] | null {
const { assetPrefix, devOnlyCacheBusterQueryString, dynamicImports } =
this.context
const {
assetPrefix,
devOnlyCacheBusterQueryString,
dynamicImports,
crossOrigin,
optimizeCss,
optimizeFonts,
} = this.context
const cssFiles = files.allFiles.filter((f) => f.endsWith('.css'))
const sharedFiles: Set<string> = new Set(files.sharedFiles)

Expand All @@ -282,7 +291,7 @@ export class Head extends Component<
cssFiles.forEach((file) => {
const isSharedFile = sharedFiles.has(file)

if (!process.env.__NEXT_OPTIMIZE_CSS) {
if (!optimizeCss) {
cssLinkElements.push(
<link
key={`${file}-preload`}
Expand All @@ -292,9 +301,7 @@ export class Head extends Component<
file
)}${devOnlyCacheBusterQueryString}`}
as="style"
crossOrigin={
this.props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN
}
crossOrigin={this.props.crossOrigin || crossOrigin}
/>
)
}
Expand All @@ -308,19 +315,14 @@ export class Head extends Component<
href={`${assetPrefix}/_next/${encodeURI(
file
)}${devOnlyCacheBusterQueryString}`}
crossOrigin={
this.props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN
}
crossOrigin={this.props.crossOrigin || crossOrigin}
data-n-g={isUnmanagedFile ? undefined : isSharedFile ? '' : undefined}
data-n-p={isUnmanagedFile ? undefined : isSharedFile ? undefined : ''}
/>
)
})

if (
process.env.NODE_ENV !== 'development' &&
process.env.__NEXT_OPTIMIZE_FONTS
) {
if (process.env.NODE_ENV !== 'development' && optimizeFonts) {
cssLinkElements = this.makeStylesheetInert(
cssLinkElements
) as ReactElement[]
Expand All @@ -330,8 +332,12 @@ export class Head extends Component<
}

getPreloadDynamicChunks() {
const { dynamicImports, assetPrefix, devOnlyCacheBusterQueryString } =
this.context
const {
dynamicImports,
assetPrefix,
devOnlyCacheBusterQueryString,
crossOrigin,
} = this.context

return (
dynamicImports
Expand All @@ -349,9 +355,7 @@ export class Head extends Component<
)}${devOnlyCacheBusterQueryString}`}
as="script"
nonce={this.props.nonce}
crossOrigin={
this.props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN
}
crossOrigin={this.props.crossOrigin || crossOrigin}
/>
)
})
Expand All @@ -361,8 +365,12 @@ export class Head extends Component<
}

getPreloadMainLinks(files: DocumentFiles): JSX.Element[] | null {
const { assetPrefix, devOnlyCacheBusterQueryString, scriptLoader } =
this.context
const {
assetPrefix,
devOnlyCacheBusterQueryString,
scriptLoader,
crossOrigin,
} = this.context
const preloadFiles = files.allFiles.filter((file: string) => {
return file.endsWith('.js')
})
Expand All @@ -375,9 +383,7 @@ export class Head extends Component<
rel="preload"
href={file.src}
as="script"
crossOrigin={
this.props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN
}
crossOrigin={this.props.crossOrigin || crossOrigin}
/>
)),
...preloadFiles.map((file: string) => (
Expand All @@ -389,9 +395,7 @@ export class Head extends Component<
file
)}${devOnlyCacheBusterQueryString}`}
as="script"
crossOrigin={
this.props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN
}
crossOrigin={this.props.crossOrigin || crossOrigin}
/>
)),
]
Expand Down Expand Up @@ -483,6 +487,10 @@ export class Head extends Component<
unstable_JsPreload,
disableOptimizedLoading,
useMaybeDeferContent,
optimizeCss,
optimizeFonts,
optimizeImages,
concurrentFeatures,
} = this.context

const disableRuntimeJS = unstable_runtimeJS === false
Expand Down Expand Up @@ -536,11 +544,7 @@ export class Head extends Component<
)
}

if (
process.env.NODE_ENV !== 'development' &&
process.env.__NEXT_OPTIMIZE_FONTS &&
!inAmpMode
) {
if (process.env.NODE_ENV !== 'development' && optimizeFonts && !inAmpMode) {
children = this.makeStylesheetInert(children)
}

Expand Down Expand Up @@ -654,32 +658,29 @@ export class Head extends Component<

return (
<head {...this.props}>
{!process.env.__NEXT_CONCURRENT_FEATURES &&
this.context.isDevelopment && (
<>
{!concurrentFeatures && this.context.isDevelopment && (
<>
<style
data-next-hide-fouc
data-ampdevmode={inAmpMode ? 'true' : undefined}
dangerouslySetInnerHTML={{
__html: `body{display:none}`,
}}
/>
<noscript
data-next-hide-fouc
data-ampdevmode={inAmpMode ? 'true' : undefined}
>
<style
data-next-hide-fouc
data-ampdevmode={inAmpMode ? 'true' : undefined}
dangerouslySetInnerHTML={{
__html: `body{display:none}`,
__html: `body{display:block}`,
}}
/>
<noscript
data-next-hide-fouc
data-ampdevmode={inAmpMode ? 'true' : undefined}
>
<style
dangerouslySetInnerHTML={{
__html: `body{display:block}`,
}}
/>
</noscript>
</>
)}
{children}
{process.env.__NEXT_OPTIMIZE_FONTS && (
<meta name="next-font-preconnect" />
</noscript>
</>
)}
{children}
{optimizeFonts && <meta name="next-font-preconnect" />}

{!isDeferred && getDynamicHeadContent()}

Expand Down Expand Up @@ -727,13 +728,9 @@ export class Head extends Component<
href={canonicalBase + getAmpPath(ampPath, dangerousAsPath)}
/>
)}
{!process.env.__NEXT_OPTIMIZE_CSS && this.getCssLinks(files)}
{!process.env.__NEXT_OPTIMIZE_CSS && (
<noscript data-n-css={this.props.nonce ?? ''} />
)}
{process.env.__NEXT_OPTIMIZE_IMAGES && (
<meta name="next-image-preload" />
)}
{!optimizeCss && this.getCssLinks(files)}
{!optimizeCss && <noscript data-n-css={this.props.nonce ?? ''} />}
{optimizeImages && <meta name="next-image-preload" />}

{!isDeferred && getDynamicScriptPreloads()}

Expand All @@ -743,10 +740,8 @@ export class Head extends Component<

{!isDeferred && getDynamicScriptContent()}

{process.env.__NEXT_OPTIMIZE_CSS && this.getCssLinks(files)}
{process.env.__NEXT_OPTIMIZE_CSS && (
<noscript data-n-css={this.props.nonce ?? ''} />
)}
{optimizeCss && this.getCssLinks(files)}
{optimizeCss && <noscript data-n-css={this.props.nonce ?? ''} />}
{this.context.isDevelopment && (
// this element is used to mount development styles so the
// ordering matches production
Expand Down Expand Up @@ -839,6 +834,7 @@ export class NextScript extends Component<OriginProps> {
devOnlyCacheBusterQueryString,
disableOptimizedLoading,
useMaybeDeferContent,
crossOrigin,
} = this.context
const disableRuntimeJS = unstable_runtimeJS === false

Expand All @@ -861,9 +857,7 @@ export class NextScript extends Component<OriginProps> {
id="__NEXT_DATA__"
type="application/json"
nonce={this.props.nonce}
crossOrigin={
this.props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN
}
crossOrigin={this.props.crossOrigin || crossOrigin}
dangerouslySetInnerHTML={{
__html: NextScript.getInlineScriptSource(this.context),
}}
Expand All @@ -875,9 +869,7 @@ export class NextScript extends Component<OriginProps> {
key={file}
src={`${assetPrefix}/_next/${file}${devOnlyCacheBusterQueryString}`}
nonce={this.props.nonce}
crossOrigin={
this.props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN
}
crossOrigin={this.props.crossOrigin || crossOrigin}
data-ampdevmode
/>
))}
Expand Down Expand Up @@ -908,9 +900,7 @@ export class NextScript extends Component<OriginProps> {
file
)}${devOnlyCacheBusterQueryString}`}
nonce={this.props.nonce}
crossOrigin={
this.props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN
}
crossOrigin={this.props.crossOrigin || crossOrigin}
/>
))
: null}
Expand All @@ -919,9 +909,7 @@ export class NextScript extends Component<OriginProps> {
id="__NEXT_DATA__"
type="application/json"
nonce={this.props.nonce}
crossOrigin={
this.props.crossOrigin || process.env.__NEXT_CROSS_ORIGIN
}
crossOrigin={this.props.crossOrigin || crossOrigin}
dangerouslySetInnerHTML={{
__html: NextScript.getInlineScriptSource(this.context),
}}
Expand Down
4 changes: 4 additions & 0 deletions packages/next/server/next-server.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -206,6 +206,7 @@ export default class Server {
domainLocales?: DomainLocale[]
distDir: string
concurrentFeatures?: boolean
crossOrigin?: string
}
private compression?: ExpressMiddleware
private incrementalCache: IncrementalCache
Expand Down Expand Up @@ -275,6 +276,9 @@ export default class Server {
domainLocales: this.nextConfig.i18n?.domains,
distDir: this.distDir,
concurrentFeatures: this.nextConfig.experimental.concurrentFeatures,
crossOrigin: this.nextConfig.crossOrigin
? this.nextConfig.crossOrigin
: undefined,
}

// Only the `publicRuntimeConfig` key is exposed to the client side
Expand Down
6 changes: 6 additions & 0 deletions packages/next/server/render.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -218,6 +218,7 @@ export type RenderOptsPartial = {
supportsDynamicHTML?: boolean
concurrentFeatures?: boolean
customServer?: boolean
crossOrigin?: string
}

export type RenderOpts = LoadComponentsReturnType & RenderOptsPartial
Expand Down Expand Up @@ -1297,6 +1298,11 @@ export async function renderToHTML(
styles: documentResult.styles,
useMainContent: documentResult.useMainContent,
useMaybeDeferContent,
crossOrigin: renderOpts.crossOrigin,
optimizeCss: renderOpts.optimizeCss,
optimizeFonts: renderOpts.optimizeFonts,
optimizeImages: renderOpts.optimizeImages,
concurrentFeatures: renderOpts.concurrentFeatures,
}

const document = (
Expand Down
Loading

0 comments on commit 84645cf

Please sign in to comment.