Vite执行npm run serve后浏览器报Cannot GET /

在使用 Vite 时，想像以前执行 npm run serve 一样，查看生产环境的应用。

在执行后并未发现异常，但在浏览器访问时，显示 Cannot GET /，说是找不到根目录。

在网上查找解决方案，发现并没有结果。可能是还没有人踩到这个坑。

查看了 package.json 文件中的 scripts，运行 npm run serve 执行的是 vite preview.

"scripts": {
  "dev": "vite",
  "build": "vue-tsc --noEmit && vite build",
  "serve": "vite preview"
}

最后通过官方文档发现，vite preview 实际上只是帮我们开启了一个静态 Web 服务器，并没有构建项目。需要先运行 npm run build 后，再运行 npm run serve 可以正常访问啦！