This addresses some errors for `/_next/data` requests where encoded `/` values in dynamic route param would cause invalid behavior, a headers already sent error would be shown when sending the fallback page in development, and when rendering the `_error` page for a data request the error response would still be treated as a data request.
This also adds test cases for these errors to prevent regression
Looks like `caniuse-lite` is out of date and causing test failures.
- I upgraded both `browserslist` and `caniuse-lite` to latest semver compatible version.
- This seemed to cause changes in ncc compiled files, so recompiled.
- `lint-staged` failed on these files even though they should be ignored. As a fix, I applied the advice from https://github.com/okonet/lint-staged#how-can-i-ignore-files-from-eslintignore-
- Updated some test snapshots. 🤔 not sure this is the way to go
Closes#12045
This PR adds support for [etags](https://tools.ietf.org/html/rfc7232#section-3.2) to Next.js' API routes, which will improve user experience and decrease network traffic by enabling usage of etag-based caching.
Since non-fallback pages don't rely on the URL for hydration we can allow them to be rewritten to but pages with fallback still can't be rewritten to because we won't be able to parse the correct `/_next/data` path to request the page's data from. I added a test for this behavior and ensured it works correctly on Now.
Example on with fallback false rewrite on Now:
https://tst-rewrite-cp9vge4bg.now.sh/about
This removes `fork-ts-checker-webpack-plugin` and instead directly calls the TypeScript API.
This is approximately 10x faster.
Base build: 7s (no TypeScript features enabled)
- `fork-ts-checker-webpack-plugin@3.1.1`: 90s, computer sounds like an airplane
- `fork-ts-checker-webpack-plugin@4.1.6`: 84s, computer did **not** sound like an airplane
- `fork-ts-checker-webpack-plugin@5.0.0-alpha.14`: 90s, regressed
- `npx tsc -p tsconfig.json --noEmit`: 12s (time: `18.57s user 0.97s system 169% cpu 11.525 total`)
- **This PR**: 22s, expected to get better when we run this as a side-car
All of these tests were run 3 times and repeat-accurate within +/- 0.5s.
This pull request refactors our TypeScript preflight check in preparation for dropping the `fork-ts-checker-webpack-plugin` plugin.
This will make reviewing the subsequent PR much easier.
---
There is no behavior change, so the existing test should cover this adequately.
By default, webpack will proceed to run loaders and plugins on all files, even after an error has been encountered during the build process.
This means you might need to wait minutes to see a syntax error encountered in one of your source files. This PR fixes that.
This adds `InferredStaticProps` and `InferredServerSideProps` to the typings.
- [x] add types for type inference
- [x] add explanation to docs
- [ ] tests - are there any?
![inferred-props](https://user-images.githubusercontent.com/56154253/79068041-24bcab00-7cc4-11ea-8397-ed1b95fbeca7.gif)
### What does it do:
As an alternative to declaring your Types manually with:
```typescript
type Props = {
posts: Post[]
}
export const getStaticProps: GetStaticProps<Props> = () => ({
posts: await fetchMyPosts(),
})
export const MyComponent(props: Props) =>(
// ...
);
```
we can now also infer the prop types with
```typescript
export const getStaticProps = () => ({
// given fetchMyPosts() returns type Post[]
posts: await fetchMyPosts(),
})
export const MyComponent(props: InferredStaticProps<typeof getStaticProps>) =>(
// props.posts will be of type Post[]
);
```
### help / review wanted
- [ ] I am no typescript expert. Although the solution works as intended for me, someone with more knowledge could probably improve the types. Any edge cases I missed?
- [ ] are there any tests I should modify/ add?
This pull request updates our TypeScript verification process to not wipe out potentially vital user comments.
Introducing a prompt process was mostly a side effect of users wanting to keep comments.
There's no reason we really need this prompt, as answering no would refuse to boot the Next.js server anyway.
---
Fixes#8128Closes#11440
This makes sure we don't duplicate the `/` route or any others while exporting with `exportTrailingSlash` enabled. We do still output `404.html` with `exportTrailingSlash` enabled in case anyone was relying on this file being present.
Fixes: https://github.com/zeit/next.js/issues/11008
This fixes an edge case where an application can seemingly randomly be opted out of the automatic static optimization from having an `_error` file that isn't directly nested under the `pages` folder e.g. `pages/hello/_error.js`.
Since in serverless mode we use the `_app` export from the first serverless page, if this `_error.js` file is used to check for custom `getIniitalProps` in `_app` and the `_error.js` page had a custom `getInitialProps` itself it would cause the check to fail opting the application out of the static optimization.
This fixes it by having the check be explicit instead of relying on the bundle name and it also adds regression tests for this. It might be good to also add a warning when `_error` or `_app` are not directly nested under the pages folder in a follow up PR
The experimental modern mode runs the type checking plugin twice, which **occasionally** suffers from a race condition that hangs the build.
This PR fixes type checking to only be run once.
While this test cannot 100% reproduce/capture the race condition, I don't feel strongly about the test case:
- We're planning on eliminating this type checking plugin ASAP (for a faster alternative)
- Modern mode implementation as-is will probably go away with webpack 5
Closes#9990 by collecting all paths with errors during `next export` and reporting them sorted in the error summary at the end.
It will produce an output similar to:
```
Error: Export encountered errors on following paths:
/nested/page
/page
/page-1
/page-10
/page-11
/page-12
/page-13
/page-2
/page-3
/page-4
/page-5
/page-6
/page-7
/page-8
/page-9
at _default (/app/next.js/packages/next/dist/export/index.js:19:788)
at process._tickCallback (internal/process/next_tick.js:68:7)
```
I tested the output with the `handle-export-errors` integration test suite, but I'm not sure how to gracefully test this added output.
I thought of collecting all page source files with [recursiveReaddirSync](2ba352da39/packages/next/next-server/server/lib/recursive-readdir-sync.ts) but it seems I can't import it in js test files:
```
SyntaxError: /app/next.js/packages/next/next-server/server/lib/recursive-readdir-sync.ts: Unexpected token, expected "," (11:5)
9 | */
10 | export function recursiveReadDirSync(
> 11 | dir: string,
| ^
12 | arr: string[] = [],
13 | rootDir = dir
14 | ): string[] {
```
The test itself could look like:
```js
it('Reports failing paths', async () => {
const { stderr } = await nextBuild(appDir, [], {
stdout: true,
stderr: true,
})
const pages = []
// collect pages to be ['/page', '/page-1', ... etc.]
pages.forEach(page => {
expect(stderr).toContain(page)
})
})
```
As discussed this adds bundling of `.env` files in `serverless` mode so that the environment values are also available when deploying with this target
closes: https://github.com/zeit/next.js/issues/13332
fix#12136
I add a prompt if there is an error when trying to download example files.
Maybe could be better to add an error class and in create-app.ts on every "console.error" trow a new Exception and manage it in catch. What you think ? 👯
This addresses #11910 in which `-e default` was not working because there was no example with the name `default`. This PR checks if a user inputted `default` as the example argument for `create-next-app` and if so it will use the local `default` template in the create-next-app directory.
Closes#11910
This waits for the render to be committed to DOM before we render the route change complete event (no longer sync in new React).
We have tests that ensure this resolves.
---
Closes#12938
This PR adds support for prepending sass code before the actual entry file.
It's common for developers to import their sass mixins and variables once on their project config so they don't need to import them on every file that requires it. Frameworks like gatsby and nuxt.js already support that handy feature.
The way it works is:
```
/// next.config.js
module.exports = {
experimental: {
sassOptions: {
prependData: `
/// Scss code that you want to be
/// prepended to every single scss file.
`,
},
},
}
```
Fixes#11617 and duplicates
Adding a conformance plugin the make sure users don't undo the benefits of the granularChunks config.
The plugin makes sure that minSize, maxInitialRequests values aren't overridden. Also ensures the cacheGroups - vendors, framework, libs, common, shared are maintained.
The warning and error messages do not break the build with this change. They only display a message.
cc - @prateekbh, @atcastle
I have a plugin with a src folder structure following jest’s recommended practice of including a `__tests__` folder:
```
$ find src/
src/
src/document-html-props-server.ts
src/__tests__
src/__tests__/document-html-props-server.unit.ts
```
collect-plugins.ts [reads the src directory](960c18da53/packages/next/build/plugins/collect-plugins.ts (L65)) and finds:
```js
[ '__tests__', 'document-html-props-server.ts' ]
```
…which it then [converts to](960c18da53/packages/next/build/plugins/collect-plugins.ts (L76-L80)):
```js
[ '', 'document-html-props-server' ]
```
…and finally [outputs](960c18da53/packages/next/build/plugins/collect-plugins.ts (L90-L96)):
```
Next.js Plugin: {my plugin} listed invalid middleware
```
This pull request makes collect-plugins.ts only consider files, so my __tests__ directory and its contents are ignored.
* Enable .env support by default
Given we've had tons of reports from various people that expected .env support to work even though they had dotenv installed already I think it's fine to enable it as a default:
Fixes#12728
* Remove old test
* Fix duplicate env loading
* Update docs
Co-authored-by: JJ Kasper <jj@jjsweb.site>
* Allow `@babel/preset-typescript` to be configured
Some usages, e.g. [getting parameter decorators to work properly](https://github.com/WarnerHooh/babel-plugin-parameter-decorator/pull/19), require configuring `@babel/preset-typescript`.
This commit adds that functionality to `next/babel`.
* Add unit test for babel/preset allowing to pass options to @babel/preset-typescript
* Add integration test for onlyRemoveTypeImports
* Update babel dependencies
* Update to compatible typescript version and fix types
* Fix linting and run pre-nccing
* Update size-limit test
* Add additional tests
* Re-Apply delta to be calculated using -262
Co-authored-by: JJ Kasper <jj@jjsweb.site>
* Add flag to disable API warning
This flag is useful when you are using an external API resolver like express when defining an API route, since the native functionality doesn't realize that the API actually sent a response.
A very simple use case example https://github.com/PabloSzx/next-external-api-resolver-examplefixes#10589
* Update api-middlewares.md
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
* Failing test to demonstrate issue #12004
* Separate position for global vs client scripts. Fixes#12004
* Revert client.ts
* Revert global.ts
Co-authored-by: Joe Haddad <timer150@gmail.com>
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
* Fix type on NextApiHandler
The example [here](https://nextjs.org/docs/api-routes/api-middlewares) shows that `NextApiHandler` can be async, so the return type should be `void | Promise<void>`.
* Add TS integration tests for API
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
* Add initial process.env stubbing for new env support
* Fix server process.env being stubbed in production
* bump
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
* Add support for params in header key/values
* Update todo
* Update with handling for named patterns
* Use compiled package
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
* Add basePath in link component and add/remove it consistently
* Update to not use regex for delBasePath
* Expose addBasePath as router method
* Revert "Expose addBasePath as router method"
This reverts commit 40fed596195c6affabf837e42d472452768e13a3.
* Expose basePath as router field
* Apply suggestion
* Expose basePath as router field
* remove un-used vars
* Update externals
* Apply lint fix
* Update size-limit test
* Update prefetch
* Confirm if user wants example when creating app
* Only ask user to choose example if they provide --example flag
* Simplify the search
* Added test
* Use a select to pick the template
* Updated test
* check for lowercase and updated no example message
* Add message if no template is selected
* Updated tests
* Handle error if fetching the examples fails
* Fixed tests
* Updated test timeout
* Update examples.ts
Co-authored-by: merelinguist <merelinguist@users.noreply.github.com>
Co-authored-by: Luis Alvarez <luis@zeit.co>
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
* Add error/warning when a page is rendered without a /
Throws an error for development and gives a warning in production
* Add tests for error when rendering without starting slash
* Update to always warn and add err.sh
* Update errors/render-no-starting-slash.md
Co-authored-by: JJ Kasper <jj@jjsweb.site>
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
* Warn when user has pages/_error but no pages/404
* Update test
* Update custom-error-no-custom-404.md
* Apply suggestions from code review
Co-Authored-By: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
* Rename unstable GSP revalidate field
* Update error message
* Tweak error message some more
* Apply suggestions from code review
Co-Authored-By: Joe Haddad <joe.haddad@zeit.co>
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
* fix(debugging): do not pass NODE_OPTIONS='--inspect' to subprocesses
fixes#11030
* fix(debugger): use a regex to remove bad NODE_OPTIONS flags
Co-authored-by: Alec Larson <alec.stanford.larson@gmail.com>
* Add initial support for new env config file
* Fix serverless processEnv call when no env is provided
* Add missing await for test method
* Update env config to .env.json and add dotenv loading
* ncc dotenv package
* Update type
* Update with new discussed behavior removing .env.json
* Update hot-reloader createEntrypoints
* Make sure .env is loaded before next.config.js
* Add tests for all separate .env files
* Remove comments
* Add override tests
* Add test for overriding env vars based on local environment
* Add support for .env.test
* Apply suggestions from code review
Co-Authored-By: Joe Haddad <joe.haddad@zeit.co>
* Use chalk for env loaded message
* Remove constant as it’s not needed
* Update test
* Update errsh, taskr, and CNA template ignores
* Make sure to only consider undefined missing
* Remove old .env ignore
* Update to not populate process.env with loaded env
* Add experimental flag and add loading of global env values
Co-authored-by: Tim Neutkens <timneutkens@me.com>
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
* Add support for tsconfig/json `paths` option
* Add tests for paths in tsconfig.json
* Don't apply aliases when paths is empty
* Clean up unused methods and link to TypeScript license
* Add tests for jsconfig
* Put feature under an experimental flag
* Enable to see if tests pass
* Update types
* Add feature under an experimental flag
* Add support for SCSS includePaths
* Support sassOptions instead of just includePaths
Co-authored-by: Tim Neutkens <timneutkens@me.com>
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
* Make sure to not show pages/404 GIP error from _app having GIP
* Add error for getStaticProps in pages/404 too
* Add support for getStaticProps in pages/404
* Update test
* Use core-js promise polyfill for nomodule browsers
Also updated to the core-js@3 features modules instead of importing the exact modules directly.
Fixes#10966
* Simplify reflect and regexp
* Add ie11 test for bad Promise
* Add test script for regexp and ie11
Co-authored-by: JJ Kasper <jj@jjsweb.site>
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
* Verify GS(S)P Serializability
* Add support for cyclic refs
* Add unit tests
* Test for error in development mode
* Fix prerender preview tests
* Fix gssp preview tests
* fix 2x test cases
* Add desired test
* fix some more tests
* Fix route manifest expect
* Fix test expects
* Test that `getServerSideProps` does not error in production
* Test that getStaticProps is not checked in production
* Test serialization check during build
* Fix export detection for serverless
* Update test/unit/is-serializable-props.test.js
Co-Authored-By: JJ Kasper <jj@jjsweb.site>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
* add new types of performance monitoring
* adding LCP
* adding cls to perf relayer
* add test for cls and lcp
* nit fixes
* re-organizing code
* fixing tests for lcp
* updating size limits in test
* 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
* Fix modern + granularChunks hydration failing
* Fix TS error
* Update native-url version
* Adding native-url with safari fix
* Update url-polyfill in polyfill-nomodule package
* Remove url-polyfill from next package.json
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
Co-authored-by: Joe Haddad <timer150@gmail.com>
* Rename getServerProps to getServerSideProps
* Remove unstable_ prefix from new methods
* Add error when legacy methods are detected
* Add legacy methods for babel transform
* Add unstable_getServerSideProps also
* Apply suggestions from code review
Co-Authored-By: Joe Haddad <joe.haddad@zeit.co>
* Update types import
Co-authored-by: Joe Haddad <timer150@gmail.com>
* Ability to Disable SSG Fallback
* Throw error when value is missing
* Fix existing tests
* Adjust error message
* Do not render fallback at build time for `fallback: false` page
* Fix existing fallback behavior
* fix build
* fix version
* fix some tests
* Fix last test
* Add docs for get static paths
* Add explicit mode tests
* test for fallback error message
* 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 calling getStaticPaths in development before showing fallback
* Move staticPathsWorker to next-dev-server
* Make sure to clear require cache in worker process
* bump
* Remove staticPathsCache member
* Update numWorkers for staticPathsWorker
* Add error messages for dynamic SSG page without getStaticPaths
* Update error check
* Update test file
* Update another test file
* Adjust
Co-authored-by: Joe Haddad <timer150@gmail.com>
* 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
* Fix modern + granularChunks hydration failing
* Fix TS error
* Update native-url version
* Adding native-url with safari fix
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
Co-authored-by: Joe Haddad <timer150@gmail.com>
* Clean up landed experimental flags
* Remove check for experimental flags from build too
* Remove /_errors/404 in favor of /404
* Remove unneeded check for pathname
* Update test paths
* Fix test
* Update test
* Remove test for disabled config
* Set pages404 always to true
Co-authored-by: Joe Haddad <timer150@gmail.com>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
* Fixed pathname check in router
Remove the query portion of the URL when checking paths
* Updated change and added trial test
* Update test
Co-authored-by: JJ Kasper <jj@jjsweb.site>
* Fix dynamic route rename failing for case change
* Update normalizing curPageFiles
* Remove using webpacks file info since its inaccurate
* Revert changes in favor of fixing upstream
* Update to latest watchpack with case rename fix
This adds a `isFallback` property to detect if the page is being rendered in "fallback" mode or normal mode.
Accessed via the `useRouter()` hook.
---
Closes#10527
* Remove any type and fix edge cases
Removed the "as any" and use the @babel/types typeguards instead. This revealed some edge cases that would just error.
* Remove ts-ignore
Co-authored-by: Joe Haddad <timer150@gmail.com>
* Adjust SSG Loading Behavior
* Update expected preview behavior
* Rename two corrections
* Only use skeleton in production for now
* Fix "should SSR SPR page correctly" test
* fix tests
* fix trailing comment letter
* disable test for now
* checkpoint: api impl
* Add support for tryGetPreviewData
* snapshot: server(less) support
* Add X-Prerender-Bypass-Mode header support
* Pass preview data to getStaticProps call
* add TODO
* setPreviewData
* 100k iterations
* Handle jwt error
* Write out preview values
* forgot file
* set preview props
* Send preview props
* add preview props
* Pass around more data
* update yarn lock
* Fail on Invalid Prerender Manifest
* Make Missing Prerender Manifest Fatal
* fix ts errors
* fix test
* Fix setting cookies + maxage
* Secure is not needed as we encrypt necessary data
* Set on domain root
* Set cookie max ages
* Render a fallback on-demand for non-dynamic pages
* Test preview mode
* remove old build
* remove snapshots
* Add serverless tests
* use afterAll
* Remove object assigns
* fix cookie spread
* add comment
* Update next-server routes order for expected priority
* Update router to allow disabling page routes
* Fix headers having check: true behavior when they should not
Co-authored-by: Joe Haddad <timer150@gmail.com>
* Add initial SSG fallback handling
* Remove extra changes and update fallback handling
* Remove extra timeout for testing
* Update SSG tests in dynamic-routing suite
* Add racing to decide between rendering fallback and data
* Update size-limit test
* Update comment
* Make sure to follow correct route change order
* Make comment more verbose for racing
* Revert getStaticData to only return Promise
* Make sure to update URL on fallback
* Add retrying for data, de-dupe initial fallback request, and merge fallback replace
* Update to add preload for fallback pages data
* Add test for data preload link
* Use pre-built fallback in production mode
* Remove preload link for fallback from _document
* Update to make sure fallback is rendered correctly for serverless