Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Stop using environment variables in pages/_document #31946

Merged
merged 4 commits into from
Nov 30, 2021
Merged

Stop using environment variables in pages/_document #31946

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
84645cf
Stop using environment variables in pages/_document
devknoll Nov 30, 2021
ca935e8
Fix serverless
devknoll Nov 30, 2021
f3f25a5
Merge branch 'canary' into x-change-env-to-render-opts
devknoll Nov 30, 2021
0e8faa3
Merge branch 'canary' into x-change-env-to-render-opts
devknoll Nov 30, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions packages/next/build/webpack/loaders/next-serverless-loader/page-handler.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -191,6 +191,10 @@ export function getPageHandler(ctx: ServerlessHandlerCtx) {
locale: detectedLocale,
defaultLocale,
domainLocales: i18n?.domains,
optimizeImages: process.env.__NEXT_OPTIMIZE_IMAGES,
optimizeCss: process.env.__NEXT_OPTIMIZE_CSS,
concurrentFeatures: process.env.__NEXT_CONCURRENT_FEATURES,
crossOrigin: process.env.__NEXT_CROSS_ORIGIN,
},
options
)
Expand Down
4 changes: 4 additions & 0 deletions packages/next/export/index.ts
View file
Open in desktop
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
Open in desktop
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 @@ -479,6 +483,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 @@ -532,11 +540,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 @@ -650,32 +654,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 @@ -723,13 +724,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 @@ -739,10 +736,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 @@ -835,6 +830,7 @@ export class NextScript extends Component<OriginProps> {
devOnlyCacheBusterQueryString,
disableOptimizedLoading,
useMaybeDeferContent,
crossOrigin,
} = this.context
const disableRuntimeJS = unstable_runtimeJS === false

Expand All @@ -857,9 +853,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 @@ -871,9 +865,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 @@ -904,9 +896,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 @@ -915,9 +905,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
Open in desktop
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
Loading