vite buildコマンドを実行すると出力ファイルでパスがおかしくなる原因が知りたい

質問内容

提示コードですが参考サイトを参考にコマンドを実行してプログラムをブラウザ上で実行したいのですが以下エラーが出る原因がわかりません。
vite buildを行うと以下のパスがおかしくなる原因がわかりません。参考サイトを参考にしていますが対処方法がわかりません。

知りたいこと

vite build後のパスがおかしくなる原因が知りたい
<script type="module" crossorigin src="/assets/index-489c85a3.js"></script>部のsrc="/"です。
src="./"のようにドットを追加するにはどうしたらいいのでしょうか？

試したこと

1,まず。以下の提示コードをnpx tsc してvute buildしてindex.htmlを開いたところ
ErrorAのエラーが発生しました(buildされたindex.html 提示コード参考)　そこで<head>タグの<script>タグの内部のsrc指定のパスがおかしいことに気づきsrc=/をsrc=./に変更したところエラーが消えました。

2, npm init vue@latestコマンドによる自動生成のプロジェクトによる実行も試しましたが同じエラーが出ます。

実行したコマンド

npx tsc
vite build

Error A

GET http://127.0.0.1:5500/assets/index-489c85a3.js net::ERR_ABORTED 404 (Not Found)

環境

OS: ubuntu
言語: Typescript,html5,scss
利用ツール: npm
ブラウザ: google chrome (vscodeの拡張機能live serverを利用)

参考サイト

クリックスタート : https://ja.vuejs.org/guide/quick-start.html#creating-a-vue-application
viteだとrequire()が使えない: https://azukiazusa.dev/blog/vite-require/

index.html

html
1<html>
2    <head>
3        <title>test</title>
4    </head>
5
6    <body>
7
8        <div id="app">
9
10            <h3>{{ message }}</h3>
11        </div>
12
13
14        <script>var exports = {};</script>
15        <script type="module" src="./script.js"></script>
16    </body>
17</html>

script.ts

ts
1import { createApp } from 'vue'
2
3createApp({
4    data() {
5      return {
6        message: 'Hello Vue!'
7      }
8    }
9  }).mount('#app')

buildされたindex.html

html
1<html>
2    <head>
3        <title>test</title>
4      <script type="module" crossorigin src="/assets/index-489c85a3.js"></script>
5    </head>
6
7    <body>
8
9        <div id="app">
10
11            <h3>{{ message }}</h3>
12        </div>
13
14
15
16
17
18
19        <script>var exports = {};</script>
20        
21    </body>
22</html>