Hi I am new to Vite. Just try a simple things but already face a problem.
I only modified a simple html which is only has <h1> Hello There>, and modified the css file just very simple.
body {
background: black;
color: aliceblue;
}
It works properly when I run 'npm run dev"
However, when I want to build it,
'npm run build"
It looks everything is perfect. See below
dist |
| | assets - index.74d163d3.js
| - index.aff04cba.css
| - index.html
However the result is white background and black text.
This is the package json :
{
"name": "pixanthony",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"devDependencies": {
"vite": "^3.1.0"
}
}
This is the code in index.aff04cba.css
body{background:black;color:#f0f8ff}
This is the code in index.html file:
<!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.74d163d3.js"></script>
<link rel="stylesheet" href="/assets/index.aff04cba.css">
</head>
<body>
<h1>Hello There !!!</h1>
</body>
</html>
Very simple and clean, just dunno what is going on.