React+Typescript cleans up the project environment

We created a React+Typescript project above . We created a project environment in which React cooperates with Ts development.
In this article, we will first clean up the environment and feel that it is convenient for subsequent development.
Let’s talk about a directory structure of React that
is still different from the React project we developed before. Some differences
are mainly to store some static resource files such as html picture icons and the like. Among them,
manifest.json contains some mobile terminal size configuration classes. The management

src is naturally our source code content.

The entry file is the index.tsx file under src

Then tsconfig.json in the root directory is a configuration file,
which contains some specific options of Typescript, so it’s better not to touch it easily.

Then we open
the following section of index.tsx under src

. This is a development method called assertion or conversion.

Then for the convenience of everyone, we will kill all the unnecessary things, open src
and delete the following App.test.tsx App.css logo.svg reportWebVitals.ts

The index.tsx under src changes the code as follows

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';

const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);
root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

Clear out all the useless ones and look comfortable.
Change the App.tsx under src to

function App() {
    
    
  return (
    <div className="App">
        hello React Typescript
    </div>
  );
}

export default App;

Then when we start the project, we will find that it is much cleaner.