CODEWITHSUNDEEP
reactjscharacter-encodingwebpack
pistou
pistou

Reputation: 2867

React + Webpack character encoding issues

I'm currently making a website using ReactJS and webpack to build it.

My text editor is set on ISO-8859-15 encoding and I'm using accented or special chars like é è à ç.

In my html page, I believe I'm using the right configuration:

<meta charset="iso-8859-15">

But special chars are not rendered the right way: Fran�ais instead of Français for instance.

I tried to set charset="utf-8" but nothing changed.

I feel like webpack is building with UTF-8 encoding, which brakes my chars. How could I fix this issue?

Upvotes: 15

Views: 20851

Answers (3)

Emanuele Pavanello
Emanuele Pavanello

Reputation: 873

To fix fetch problems with not utf-8 endpoints this is the solution:

fetch(url)
    .then(response => response.arrayBuffer())
    .then(buffer => {
      let decoder = new TextDecoder('iso-8859-1');
      return decoder.decode(buffer);
    })
    .then(res => JSON.parse(res))

Upvotes: 0

Rafael Vaz de Lima
Rafael Vaz de Lima

Reputation: 17

I solved by changing the .js file encoding format to UTF8. I just oppened the file with Notepad ++ and I did: Format -> Converto to UTF8.

Upvotes: -2

S&#233;rgio Siegrist
S&#233;rgio Siegrist

Reputation: 116

I didn't find a way to make webpack read input files with an encoding other than UTF-8. I had to set up my project to write source files in UTF-8, and then used webpack-encoding-plugin to output files as ISO-8859-1 or whatever. It worked.

Upvotes: 10

Related Questions