This allows a page to be fully static (no runtime JavaScript) on a per-page basis.
The initial implementation does not disable JS in development mode as we need to figure out a way to inject CSS from CSS imports / CSS modules without executing the component JS. This restriction is somewhat similar to https://www.gatsbyjs.org/packages/gatsby-plugin-no-javascript/. All things considered that plugin only has a usage of 600 downloads per week though, hence why I've made this option unstable/experimental initially as I'd like to see adoption patterns for it first.
Having a built-in way to do this makes sense however as the people that do want to adopt this pattern are overriding Next.js internals currently and that'll break between versions.
Related issue: #5054 - Not adding `fixes` right now as this implementation needs more work. If anyone wants to work on this feel free to reach out on https://twitter.com/timneutkens
* Make sure to show error when url prop is returned for a page
* Update test and handle undefined pageProps
* Handle empty props
* Apply suggestions from code review
Co-Authored-By: Tim Neutkens <tim@timneutkens.nl>
* Update tests
* Update to not add url prop for SSG/SSP pages
* Update errsh for reserved prop
* Update errsh wording some more
* Update tests and to warn instead of error
* Update reserved prop warning
* Include page in url prop warning
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: Joe Haddad <timer150@gmail.com>
* Add failing hydration test
* Add importing of next/router to _app
* Fix type
* Update _app check for windows
* Remove babel fix
* Update to use webpack to require next/router
* Enable New CSS Support by Default
* Adjust configs
* Fix invisible AMP body
* Fix AMP validation warning
* test fix
* Use expression that won't be eliminated by babel
* Adding native-url package
* Bumping native-url version
* Upgrading native-url
* Logging stats object for debugging
* Logging stats object for debugging
* Adding try catch to the error lines
* Experimenting with regex
* Experimenting with regex
* Experimenting with regex
* Testing regex changes
* Fixing defer-script test case to not include polyfill.js
* Meging changes with existing polyfill work
* Bumping version
* adjust webpack config
* Reduce size in size test
* Remove 1kb from legacy
* Bumping native-url version, includes fix for IE11
* Update lock file
* Updating native-url, fixes issue on IE11
* Fix sourcemap being added in document
* Adding Router as an app level dep. Fixes Router not being added as a dep to pages without Link when granularChunks is enabled
* Fix typescript error
* Adding native-url package
* Bumping native-url version
* Upgrading native-url
* Logging stats object for debugging
* Logging stats object for debugging
* Adding try catch to the error lines
* Experimenting with regex
* Experimenting with regex
* Experimenting with regex
* Testing regex changes
* Fixing defer-script test case to not include polyfill.js
* Meging changes with existing polyfill work
* Bumping version
* adjust webpack config
* Reduce size in size test
* Remove 1kb from legacy
* Bumping native-url version, includes fix for IE11
* Update lock file
* Updating native-url, fixes issue on IE11
* Fix sourcemap being added in document
* Polyfilling fetch and object-assign
* Polyfilling corejs object-assign
* Adding object-assign in polyfills.js. IE11 does not support Object.assign
* Fixing failing test
* Updating object.assign polyfill to fix aliasing
* Updating test case value to match new build stats
* Increasing the size of default build to 225kb
* Fixing defer-script test case to not include polyfill.js
* Revert README.md
* Re-design the polyfill approach based on PR feedback
* Adding comment and fixing test case
* Rename polyfills chunk
* Extract aliases into helper
* Remove extra new line
* Fix TypeScript typings
* Adding _internal_fetch alias
* Adjust build manifest plugin
* Build manifest plugin changes - adding a separate entry for polyfills
* Rename polyfills entry in build-manifest.json
* Remove old comment
* Fix TS
* Set key
* Polyfills already added
* Filtring polyfill.module.js
* Fix test
* Add __internal_fetch to alias rule
* Adjust name
* bump size
* ignore polyfills
* sigh
* Add initial bit for plugins
* Add checks for needed metadata values
* Add test
* Initial plugins changes
* Add handling for _app middleware
* Add loading of _document middleware and
handling of multiple default export syntaxes
* Fix insert order for middleware member expression
* Remove early return from middleware plugin from testing
* Add tests for current plugin middlewares
* Update test plugin package.json
* Update handling for class default export
* Update to use webpack loader instead of babel
plugin, remove redundant middleware naming, and add field for required env for plugins
* Add middleware to support material-ui use case
and example material-ui plugin
* Update tests and remove tests stuff from google analytics plugin
* Remove old plugin suite
* Add init-server middleware
* Exit hard without stack trace when error in collecting plugins
* Add on-error-client and on-error-server and update
to run init-server with next-start in serverless mode
* Update init-client for google analytics plugin
* Add example Sentry plugin and update with-sentry-simple
* Remove middleware field/folder and use src dir for plugins
* Add post-hydration middleware and update
material-ui plugin
* Put plugins code behind flag
* Update chromedriver
* Revert "Update chromedriver"
This reverts commit 1461e978e677f7da05e29e0415ec614a04bf65f9.
* Update lock file
* Remove un-needed _app for sentry example
* Add auto loading of scoped packages, add plugins
config for manually listing plugins, and update
to only collect plugins once
* Update example plugins
* Expose plugins' config
* Rename plugin lifecycles and add babel-preset-build
* Rename other methods with unstable
* Update log when plugin config overrides auto-detecting
* allow NextScript to optionally defer javascript
* move defer options to experimental feature
* combine defer flags into a single option
* Update deferScripts to work with serverless target
* Add test for defer and async property
* Read the async property
* Check versions of chrome and chromedriver
* Update to chromedriver 76
* Fix test
Before this patch users would see the following warning during initial
compilation:
```
Warning: Each child in a list should have a unique "key" prop. See https://fb.me/react-warning-keys for more information.
in link
in Head
in html
in Html
in Document
in Context.Provider
in Context.Provider
```
* Show content as soon as <style> tags are added
* Add fallback removal
* Add test for when unused
* Ensure the function is ES5 compatible
* IE support
* Test it works on broken pages
* Fix CSS Ordering
This fixes CSS ordering between development and production.
Before this change, globally imported CSS would come _after_ `<style jsx global>` in development, but _before_ in production.
After this change, it'll always be applied before.
* Move to correct element
* Add tests
* Fix obnoxious indents
* Update test/integration/css/fixtures/with-styled-jsx/pages/index.js
Co-Authored-By: JJ Kasper <jj@jjsweb.site>
We were trying to be too tricky. `visibility: hidden` is great for layout speed, but it allows child elements to make themselves visible.
Since styles are going to change anyway, this doesn't make sense. We should completely hide the body which prevents a reflow by avoiding any style computation until Global CSS is ready to go.
* Global CSS Support
* Fix webpack configuration
* oneOf rule isn't necessary yet
* Adjust CSS chunk naming
* Begin testing CSS behavior
* Add another test TODO
* Replace null-loader with ignore-loader
* Turn on chunks for new CSS feature
* Fix multi test suite
* Test CSS import order
* Test style HMR
* Test CSS compilation
* Test compilation and prefixing together
* Verify CSS styling works for Development and Production
* Add missing TODO
* Remove unnecessary test
* Adjust TODO message
* Hide page until React hydrates
* Revert "Hide page until React hydrates"
This reverts commit 898d4e0ee547b003d5790e2b11476740d645b907.
* Hide FOUC during development
* Test CSS imports
* Update tests TODO
* Add fixture for url() test
* Test `file-loader` support in CSS files
* Use a simple variant of cssnano
* Self-import
* Undo bundling
* Implement suggestion
* Add deprecation warning for App Container
* Apply suggestions from code review
Co-Authored-By: Joe Haddad <joe.haddad@zeit.co>
* Tweak for more dead-code elimination
Fixes#3494
Removes `class="next-head"` from the children of the `<Head>` component. Instead, a single sentinel meta element named `next-head-count` is appended. The content is the number of contiguous elements immediately preceding the sentinel that _would have had_ the `class="next-head"` attribute.
During an update, instead of searching for `class="next-head"`, the sentinel is located and the N previous elements are considered candidates for `oldTags`. New elements are inserted before the sentinel, and finally the sentinel is updated to reflect the new count.
* Module/nomodule implementation based on RFC 7563
* Remove comment
* Fixing issue with building amp pages
* Fixing test cases for serverless mode
* Adding safari 10 nomodule fix. Preloading modern js by default
* Fixing size-limit integration test
* Bug fix
* Adding testcase for modern build
* Trigger rebuild
* Setting default crossOrigin value
* Moving modern config option inside experimental flag
* Adding nomodule attribute to safari-fix script
* Changing safari10NomoduleFix default value to true
* Removing safari-fix flag
* Changing .es6 to .module
* Disable modern default
* Removing default crossOrigin value. Setting modern flag to false by default. Fixed test cases
* Remove confusing defaults and mark required instead
* Adjust blacklist
* Move behavior of page marking
* Fixing childCompiler errors not being captured
* Tweak names
* Revert
* whoops
* Fixing bug with page-loader.js
* Changing modern babel cache name
* Rename helper
* Iterate over both bundles
* Correctly clamp bundle sizes
* Revert test
* Add modern mode tests
* Fix test
* test
* test2
* Change static method handling and pages revert
* Allow and reflect old behaviour
* Post should return 501
* Add back old test
* Invert logic
* Handle 501 for pages in separate location
* Remove usage of 501 HTTP status code
* Prevent information leak
* Add test
* Only 405 if the page exists -- 404 if it doesn't
* Handle sent responses
* Revert "Handle sent responses"
This reverts commit 5e9012ae29b611c25ed1e090756a25dbe3437182.
* Fix bad test
* Switch back to quiet
* Update test/integration/production/test/index.test.js
Co-Authored-By: JJ Kasper <jj@jjsweb.site>
* Move client-side dev JS to dev folder
* Move eventsource polyfill
* Move source-map-support
* Move error boundary
* Deprecate Container in _app
* Make initialRender check better
* Remove unused code
* Only support one subscription as there is only one
* Don’t spread object
* Shorten property name
* Add container in development too
* Simplify query update logic
* Refresh query on mount for exported pages
* Make sure to only refresh query if it is different
* Only update if search isn't empty
* Merge pre-rendered query values with
current query values
* Remove dynamic restriction for autoExporting
* Update dynamic routing test fo autoExport
* Remove autoExport from client-navigation test
* Remove logs and update trailing slash config
* Update nextExport tests in client-navigation
* Disable autoExport in export suite
* Upgrade to latest AMP toolbox optimizer
* Remove amphtml from AMP only and update tests
* Update tests
* Apply suggestions from code review
Co-Authored-By: Joe Haddad <timer150@gmail.com>
* Add canonicalBase config to allow setting
absolute path for canonical link
* Make sure canonicalBase is set for
export and serverless
* Move canonicalBase to amp.canonicalBase
* Update tests with canonicalBase config
* Update tests
* run lint-fix
* Fix canonicalBase config parsing
* Fix canonicalBase during export
* Update amphtml tests
* Initial version of build watcher working
* Move build watcher div to Main component
* Add a better design, remove container from DOM when not visible
* Fix flickering when closing and opening too fast
* Add a field on next config file for two styles and completely removal
* Ops, bring back fade-in animation
* Remove unnecessary commas
* Render building text by CSS, remove unnecessary jsx attribute
* Remove React usage
* Add support to IE/Edge
* Fix linter issues
* Set custom property with data attribute
* Use ondemand: 1 to don't override current listeners
* Use more strict rules to avoid outside CSS effects
* Use lighter box shadow
* Fix registering HMR callback
* Move initializing build watcher to client/next-dev
* Remove buildWatcherStyle and only use minimal
* Move build watcher element to render
* Move it to create element on initialize
* Fix type error from canary
* Remove extra log
* Simplify SVG markup
* App, Document, Page, Error types description
* Router description
* Added head changed router
* Additions
* Fix examples
* Push and replace details
* Update packages/next-server/lib/head.tsx
Co-Authored-By: Luis Fernando Alvarez D. <luis@zeit.co>
* Update packages/next-server/lib/utils.ts
Co-Authored-By: Luis Fernando Alvarez D. <luis@zeit.co>
* Update packages/next/types/index.d.ts
Co-Authored-By: Luis Fernando Alvarez D. <luis@zeit.co>
* Update packages/next/pages/_document.tsx
Co-Authored-By: Luis Fernando Alvarez D. <luis@zeit.co>
* Update packages/next/pages/_document.tsx
Co-Authored-By: Luis Fernando Alvarez D. <luis@zeit.co>
* Update packages/next/pages/_app.tsx
Co-Authored-By: Luis Fernando Alvarez D. <luis@zeit.co>
* Update packages/next/pages/_document.tsx
Co-Authored-By: Luis Fernando Alvarez D. <luis@zeit.co>
* Add automatic exporting of pages with no getInitialProps
* Add support for exporting serverless to static
and serving the html files during next start
* Fix missing runtimeEnv when requiring page, re-add warning
when trying to export with serverless, and update tests
* Update flying-shuttle test
* revert un-used pagesManifest change
* remove query.amp RegExp test
* Fix windows backslashes not being replaced
* Re-enable serverless support for next start
* bump
* Fix getInitialProps check
* Fix incorrect error check
* Re-add check for reserved pages
* Fix static check
* Update to ignore /api pages and clean up some tests
* Re-add needed next.config for test and correct behavior
* Update RegExp for ignored pages for auto-static
* Add checking for custom getInitialProps in pages/_app
* Update isPageStatic logic to only use default export
* Re-add retrying to CircleCi
* Update query during dev to only have values
available during export for static pages
* Fix test
* Add warning when page without default export is
found and make sure to update pages-manifest
correctly in flying-shuttle mode
* Fix backslashes not being replaced
* Integrate auto-static with flying-shuttle
and make sure AMP is handled in flying-shuttle
* Add autoExport for opting in
* Moved server/lib/utils.js to Typescript
* moved _app.js to Typescript
* Moved _error.js to Typescript
* Added argument for custom props in _app and _error
* Moved _document.js to Typescript
* updated one test
* Updated types and added a validation for _document props
* Improved types
* Fixed some types
* Updated AppType
* Fixed some tests
* Added missing import
* Removed a not very useful type
* Fix missing type
* Move @types/styled-jsx
* Fix typescript errors
* Make styles compatible in AMP mode
* bump
* Update to parse styles from fragment for
backwards compat in AMP mode
* Add test for AMP styles fragment support
* Update amphtml and canonical rels, put amp behind
experimental flag again, and update checking for amp query
* Fix typescript error
* Re-add flag to next.config.js
* Make sure AmpContext is available during _document
render and update filtering of script tags in AMP mode
* Update amphtml test to make sure
AmpContext is set for _document render
* Fix stray comma in render.tsx
* Add WithAmp to enable AMP support for
pages instead of .amp.js
* Update handling for exporting AMP
* Fix ampPath in export for / path and
revert isAmp logic to handle right
* Update amphtml test suite
* Add handling for noDirtyAmp during
export and update amp-export test suite
* Update serverless and export-default-map
test suites
* Update require-page tests
* Added amp-toolbox-optimizer and added
optimizing AMP pages as dirty and clean
* Fix amp-optimizer breaking serverless build
* Exclude amp-toolbox-optimizer from serverless build
* Added check to make sure hybrid AMP pages
optimize cleanly during export
* Add check to make sure noDirtyAmp is applied
Drops user `<script>` tags and shows a warning in AMP mode. Right now they are only dropped in production mode and left in dev mode so the validator shows its warning since it looks like conflicting props log messages are being cleared causing them to not show.
Closes: #6688
* Add default viewport meta tag (fixes#6698)
* Do not inject default viewport when rendering an AMP document
* Remove redundant viewport on error page
* Plumb withSideEffect() to pass through props, then use that for isAmp.
* Add tests for viewport meta tag.
* Fix linting
* Update dedupes test