Skip to content
New issue

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

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

Already on GitHub? # to your account

feat!: remove v1 route convention codepaths #5649

Merged
merged 9 commits into from
Mar 23, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
9 changes: 9 additions & 0 deletions .changeset/remove-v1-routes.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
---
"remix": major
"@remix-run/dev": major
"@remix-run/react": major
"@remix-run/server-runtime": major
"@remix-run/testing": major
---

remove v1 route convention codepaths
Original file line number Diff line number Diff line change
@@ -1,22 +1,8 @@
---
title: Route File Naming (v2)
title: Route File Naming
---

# Route File Naming (v2)

You can opt-in to the new route file naming convention with a future flag in Remix config. It will be the default behavior in the future when v2 ships. For background on this change, [see the RFC][flatroutes-rfc].

```js filename=remix.config.js
module.exports = {
future: {
v2_routeConvention: true,
},
};
```

We encourage you to make this change early so upgrading is easy. We'll be providing a helper function to use the old convention in v2 if you prefer it.

---
# Route File Naming

While you can configure routes in [remix.config.js][remix-config], most routes are created with this file system convention. Add a file, get a route.

Expand Down
321 changes: 0 additions & 321 deletions docs/file-conventions/routes-files.md

This file was deleted.

6 changes: 3 additions & 3 deletions docs/guides/data-loading.md
Original file line number Diff line number Diff line change
Expand Up @@ -146,7 +146,7 @@ export { db };

And then your routes can import it and make queries against it:

```tsx filename=app/routes/products/$categoryId.tsx
```tsx filename=app/routes/products.$categoryId.tsx
import type { LoaderArgs } from "@remix-run/node"; // or cloudflare/deno
import { json } from "@remix-run/node"; // or cloudflare/deno
import { useLoaderData } from "@remix-run/react";
Expand Down Expand Up @@ -176,7 +176,7 @@ export default function ProductCategory() {

If you are using TypeScript, you can use type inference to use Prisma Client generated types when calling `useLoaderData`. This allows better type safety and intellisense when writing code that uses the loaded data.

```tsx filename=app/routes/products/$productId.tsx
```tsx filename=app/routes/products.$productId.tsx
import type { LoaderArgs } from "@remix-run/node"; // or cloudflare/deno
import { json } from "@remix-run/node"; // or cloudflare/deno
import { useLoaderData } from "@remix-run/react";
Expand Down Expand Up @@ -324,7 +324,7 @@ Sometimes you need to read and change the search params from your component inst

Perhaps the most common way to set search params is letting the user control them with a form:

```tsx filename=app/routes/products/shoes.tsx lines=[8,9,16,17]
```tsx filename=app/routes/products.shoes.tsx lines=[8,9,16,17]
export default function ProductFilters() {
return (
<Form method="get">
Expand Down
2 changes: 1 addition & 1 deletion docs/guides/data-writes.md
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ Whether you use `<form>` or `<Form>` though, you write the very same code. You c

Let's start with our project form from earlier but make it usable:

Let's say you've got the route `app/routes/projects/new.js` with this form in it:
Let's say you've got the route `app/routes/projects.new.js` with this form in it:

```tsx
export default function NewProject() {
Expand Down
Loading