OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

Vite .html file doesn't end up the same at build version

  • Thread starter Thread starter Cid-Wings
  • Start date Start date
C

Cid-Wings

Guest
Code:
    npm create vite@latest ./ 
    npm install

got me this

the result of the two last command

I open the index.html and i just add a div

Code:
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite App</title>
  </head>
  <body>
    <div>Hello world</div> <!-- the div I add -->
    <div id="app"></div>
    <script type="module" src="/main.js"></script>
  </body>
</html>

then I

Code:
npm run build

enter image description here

inside the ./dist.index.html my div I just add was not compile at all

Code:
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite App</title>
    <script type="module" crossorigin src="/assets/index-BLvcXRAk.js"></script>
    <link rel="stylesheet" crossorigin href="/assets/index-BfibREyH.css">
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>

So what can I do to have this get compiled ?

<pre><code> npm create vite@latest ./
npm install
</code></pre>
<p>got me this</p>
<p><a href="https://i.sstatic.net/T4IM7LJj.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/T4IM7LJj.png" alt="the result of the two last command" /></a></p>
<p>I open the index.html and i just add a div</p>
<pre><code><!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title>
</head>
<body>
<div>Hello world</div> <!-- the div I add -->
<div id="app"></div>
<script type="module" src="/main.js"></script>
</body>
</html>
</code></pre>
<p>then I</p>
<pre><code>npm run build
</code></pre>
<p><a href="https://i.sstatic.net/pgM4G8fg.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/pgM4G8fg.png" alt="enter image description here" /></a></p>
<p>inside the ./dist.index.html my div I just add was not compile at all</p>
<pre><code><!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title>
<script type="module" crossorigin src="/assets/index-BLvcXRAk.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-BfibREyH.css">
</head>
<body>
<div id="app"></div>
</body>
</html>
</code></pre>
<p><strong>So what can I do to have this get compiled ?</strong></p>
 

Latest posts

S
Replies
0
Views
1
Safwan Aipuram
S
Top