Skip to content

Instantly share code, notes, and snippets.

@parties
Last active November 15, 2024 23:32
Show Gist options
  • Save parties/90cdf35f9a3d05bea6df76dc83a69641 to your computer and use it in GitHub Desktop.
Save parties/90cdf35f9a3d05bea6df76dc83a69641 to your computer and use it in GitHub Desktop.
rename all *.js files containing React markup to *.jsx
# finds all *.js files that have either `</` or `/>` tags in them and renames them to *.jsx
find ./src -type f -name '*.js' -not -name '*.jsx' -not -name '*.ejs' -exec bash -c 'grep -l -E "</|/>" "$0"' {} \; -exec bash -c 'mv "$0" "${0%.js}.jsx"' {} \;
@ViktorPontinen
Copy link

Does not seem to catch files that only have custom react hooks defined. But maybe those do not need to be .jsx? (In context of Vite).

@Dev-Zhao
Copy link

Dev-Zhao commented May 21, 2024

@ViktorPontinen only files containing jsx code need to be .jsx (for vite)

@d4nielchaves
Copy link

Thank you!

@TimKochDev
Copy link

Us poor windows users can use the following powershell command:

Get-ChildItem -Path ./src -Filter *.js -Recurse | Where-Object { 
    $_.Name -notlike '*.jsx' -and $_.Name -notlike '*.ejs' 
} | ForEach-Object {
    $fileContent = Get-Content $_.FullName
    if ($fileContent -match '</|/>') {
        $newFileName = $_.FullName -replace '\.js$', '.jsx'
        Rename-Item -Path $_.FullName -NewName $newFileName
    }
}

(The code above is ai generated but worked flawlessly for me. The matching logic should be the same as in the original bash script.)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment