When we install Svelte in a fresh project, we get few files auto filled with demo data. We need to erase this in order to start writing code for our project.
src/main.js
In this file, we don’t need to pass any prop to App.svelte
component. So, we can delete that. Our main.js should look like this –
import App from './App.svelte';
const app = new App({
target: document.body,
});
export default app;
src/App.svelte
Delete everything from this file. We will start with a fresh empty file.
public/global.css
We do not want any global css because we will install tailwindcss. So delete everything from this file too.
public/index.html
In this file change the title with the title of your project.
Code Example
Let’s start writing our first code. open App.svelte
file and write the below code –
<style>
main {
font-family: sans-serif;
text-align: center;
}
</style>
<main>
<h1>Tony Stark is Ironman</h1>
</main>
In this file we have included style and html. Similarly, you can include script also. We will discuss in future articles.