ZemTSX/
├── public
├── src
| ├── assets/
| ├── containers/
| ├── component/
| ├── index.scss
| ├── app.tsx
| └── main.tsx
├── .eslintrc
├── .gitignore
├── index.html
├── package.json
├── tsconfig.json
└── vite.config
Components Structure /
: Root template folder contain all react component(Structure page), css, scss, images and other files.
public/
: Vite has built-in support for
serving static assets living in the public/ directory.
For example, if we save a file in public/abc.txt , then
it will be served us as-is at https://domain.com/abc.txt
.
src/
: this file contains all the source
file in the template.
assets/
: A folder where you can put
images, css, json data anything else to be copied
wholesale when you build your application..
components/
: This file contains all
the common data files in the template
containers/
: This file contains all the
components data.
app.tsx
: Defines AppModule, the root
module that tells vite-react how to assemble the
application. Right now it declares only the
AppComponent. Soon there will be more components to
declare.
main.tsx
: React Routing basically means
navigating between pages. You have seen many sites
with links that direct you to a new page. This can
be achieved using routing.
.gitignore
: Git configuration to make
sure autogenerated files are not commited to source
control.
index.html
: The main page that is
served when someone visits your site. Most of the
time you'll never need to edit it. The CLI
automatically adds all tsx and css files when
building your app so you never need to add any
<script>
or
<link>
tags here manually.
package.json
: npm configuration
listing the third party packages your project uses.
You can also add your own custom scripts here.
vite.config.js
: the file
vite.config.js is the stands for configuration
management tools. and we mostly use for to configure
the root routing path
Note: When you run gulp command libs files are generated in dist folder and those files wont included in src folder.