React Displays Symbols Instead of Accents

I'm facing a persistent issue in my React application where accented characters are being displayed as symbols. This problem is observable even in the developer tools, where the accented characters are already appearing as symbols. I'm currently using the latest version of Microsoft Visual Studio

Strucutre of some of my components:

App.js:

javascriptCopy codeimport React from 'react';import './App.css';// ... other importsfunction App() {    // ... App logic    return (<div className="App">            {/* Content involving text */}</div>    );}export default App;

CadastroPacienteBiopsia.css:

cssCopy code/* CSS styles showing how elements are styled */.formulario-cadastro {    /* styles */}/* ... other styles */

NeurocirurgiaDashboard.jsx:

javascriptCopy codeimport React, { useState, useEffect } from 'react';// ... other importsfunction NeurocirurgiaoDashboard() {    // Component logic    return (<div className="dashboard">            {/* Content involving text */}</div>    );}export default NeurocirurgiaoDashboard;

Attempts Made:

Ensured that file encoding is set to UTF-8 in the editor.Included in the HTML file.Verified that the database and API responses are correct.

Despite these implementations, the issue with accented characters persists. The characters are displayed as symbols in the application as well as in the developer tools. This leads me to suspect the issue might be related to how React or my development environment is handling character encoding.

Could anyone suggest a solution or point out what I might be missing here? Any help or guidance would be greatly appreciated.

Thank you in advance!