61

Does anyone know an easy way to change a file extension in Javascript?

For example, I have a variable with "first.docx" but I need to change it to "first.html".

Manuel Bitto
  • 5,073
  • 6
  • 39
  • 47
Joseandro Luiz
  • 8,744
  • 4
  • 20
  • 20

8 Answers8

96

This will change the string containing the file name;

let file = "first.docx";

file = file.substr(0, file.lastIndexOf(".")) + ".htm";

For situations where there may not be an extension:

let pos = file.lastIndexOf(".");
file = file.substr(0, pos < 0 ? file.length : pos) + ".htm";
Alex K.
  • 171,639
  • 30
  • 264
  • 288
  • 7
    Note that there's an edge case if you use this on a filename that doesn't already have an extension. – hippietrail Feb 28 '16 at 00:16
  • how would i achieve setting the file format if i'm downloading from a website that doesn't provide a typical file?? it's just a url. i.e. **https://r5---sn-uxa0n-t8gs.googlevideo.com/videoplayback?ipbits=0&initcwndb…D134213BA9465CB74DFD36CDE47BF.102638C4A9F3ACA357F79EE747DD5F49F1E0F0DE** – oldboy Jul 26 '17 at 02:59
  • 1
    This code is for getting an existing extension from a known file name, if you don't have a file name your problem is different. Submit a new question perhaps. – Alex K. Jul 26 '17 at 09:23
  • 1
    This fails for paths like `foo.bar/qux`, i.e. no extension but dot in parent dir name. See [my answer](https://stackoverflow.com/a/57371333/3425536) for a solution that also handles these cases. – Emil Laine Aug 06 '19 at 07:54
34

I'd use this:

path.format({ ...path.parse('/path/to/file.txt'), base: '', ext: '.md' })

to change "/path/to/file.txt" to "/path/to/file.md".

mizkichan
  • 539
  • 5
  • 12
32

In Node.js:

path.join(path.dirname(file), path.basename(file, path.extname(file)) + '.md')

or more readably:

// extension should include the dot, for example '.html'
function changeExtension(file, extension) {
  const basename = path.basename(file, path.extname(file))
  return path.join(path.dirname(file), basename + extension)
}

Unlike the accepted answer, this works for edge cases such as if the file doesn't have an extension and one of the parent directories has a dot in their name.

Emil Laine
  • 41,598
  • 9
  • 101
  • 157
18
file = file.replace(/\.[^.]+$/, '.html');
Илья Зеленько
  • 7,509
  • 3
  • 44
  • 55
ChaosPandion
  • 77,506
  • 18
  • 119
  • 157
6

This probably won't get many upvotes but I couldn't resist.

This code will deal with the edge case where a file might not have an extension already (in which case it will add it). It uses the "tilde trick"

function changeExt (fileName, newExt) {
  var _tmp
  return fileName.substr(0, ~(_tmp = fileName.lastIndexOf('.')) ? _tmp : fileName.length) + '.' + newExt
}

EDITED: thanks @kylemit for a much better gist which uses the same logic, but in a much much neater way:

function changeExt(fileName, newExt) {
  var pos = fileName.includes(".") ? fileName.lastIndexOf(".") : fileName.length
  var fileRoot = fileName.substr(0, pos)
  var output = `${fileRoot}.${newExt}`
  return output
}

console.log(changeExt("img.jpeg", "jpg"))             // img.jpg
console.log(changeExt("img.name.jpeg", "jpg"))        // img.name.jpg
console.log(changeExt("host", "csv"))                 // host.csv
console.log(changeExt(".graphqlrc", "graphqlconfig")) // .graphqlconfig
Merc
  • 16,277
  • 18
  • 79
  • 122
  • Hey Merc, dredging up this answer from 3 years ago. It's clever, but a doozy of a one-liner. Might I humbly suggest replacing this [ES6 version in gist](https://gist.github.com/KyleMit/be4790e984410326ea6d9351fd13f1ee) which handles the same edge cases, but with a little more clarity – KyleMit Sep 20 '20 at 13:47
  • Nice one. I hate oneliners too :D – Merc Sep 21 '20 at 23:22
2

path.parse("first.docx").name + ".html"

Mikki Ukraine
  • 175
  • 8
  • 2
    While this code may answer the question, providing additional context regarding how and/or why it solves the problem would improve the answer's long-term value. You can find more information on how to write good answers in the help center: https://stackoverflow.com/help/how-to-answer . Good luck – nima Oct 14 '21 at 21:28
1

There is no specific method for setting a file extension in JavaScript or in Node.js so the solution boils down to modifying the string.

let file = 'test.txt';

function changeFileExtension(str,ext){
  return str.split('.')[0] + `.${ext}`;
}

console.log(changeFileExtension(file,'html'));
Ronnie Royston
  • 16,778
  • 6
  • 77
  • 91
0
var file = "first.docx";
file = file.split(".");
file = file[0]+".html";
一二三
  • 21,059
  • 11
  • 65
  • 74
Maxime
  • 3,167
  • 7
  • 26
  • 33