npx migrate-flat-routes

[andrelandgraf]

Hey Michael,

Very awesome that you built a migration script! Trying to use it to prep for Remix v2!

I am trying to run the migration script, but running npx migrate-flat-routes ./app/routes ./app/flatroutes --convention=flat-folders results in:

npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/migrate-flat-routes - Not found
npm ERR! 404 
npm ERR! 404  'migrate-flat-routes@*' is not in this registry.
npm ERR! 404 
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

I found the command in the Migration section of the README. What am I doing wrong?

[andrelandgraf]

Installing remix-flat-routes as a dependency fixes the issue! I thought npx would match the command with an npm package on npmjs.org. I wasn't aware it would also look at the local package.json to find a dependency with a fitting command!

[kiliman]

Yeah, sorry. When I wrote the migration script, I assumed people would already have the package installed as you needed it anyway since the v2 convention wasn't available yet.

Anyway, it turns out that the current migration script doesn't work. I'm working on a fix.

[andrelandgraf]

No reason to apologize! ChatGPT came to the rescue, and I built myself a small bash script:

#!/bin/bash

if [ "$#" -ne 1 ]; then
    echo "Usage: $0 <path>"
    exit 1
fi

# Base directory provided as argument
BASE_DIR="$1"

# Source and target directories
SRC_DIR="${BASE_DIR}/app/routes"
TARGET_DIR="${BASE_DIR}/app/flatroutes"

# Create target directory if it doesn't exist
mkdir -p "${TARGET_DIR}"

# Function to convert folder path into the V2 filename format
convert_to_v2_name() {
    local relpath="$1"
    local filename="$2"

    # Replace forward slashes with dots
    local newpath="${relpath//\//.}"

    # Prefix underscore to folders starting with __
    newpath="${newpath//.__/_}"
    newpath="${newpath//__/_}" # Adjust double underscores to single underscore

    # For files directly under routes, remove the prefixed dot
    [[ "$newpath" == "." ]] && newpath=""

    # For files named "index.tsx", prefix with an underscore
    [[ "$filename" == "index.tsx" ]] && filename="_index.tsx"

    # Adjust filenames starting with double underscores to single underscore
    filename="${filename//__/_}"

    echo "${newpath}${newpath:+.}${filename}"
}

# Recursively find all files in SRC_DIR and process each file
find "${SRC_DIR}" -type f | while read -r filepath; do
    relpath="${filepath#${SRC_DIR}/}"          # Extract relative path
    folderpath="$(dirname "$relpath")"         # Extract folder path from relative path
    filename="$(basename "$relpath")"          # Extract filename

    # Convert folder path to V2 naming
    newfilename=$(convert_to_v2_name "$folderpath" "$filename")

    # Log the transformation
    echo "Move ${relpath} -> ${newfilename}"

    # Copy contents from source file to target file
    cp "${filepath}" "${TARGET_DIR}/${newfilename}"
done

# Delete the routes folder
rm -rf "${SRC_DIR}"

# Rename the flatroutes folder to routes
mv "${TARGET_DIR}" "${SRC_DIR}"

echo "Transformation completed!"

But yes, the migration script will 100% be super helpful to many folks once Remix v2 is out and more folks start migrating to the v2 route convention!

[elledienne]

@kiliman are you still planning to work on the migration script by any chance? We were planning to use it to migrate our codebase. We would be willing to help if you lack bandwith