npm run build 不包含我使用 vite 的 src 文件夹

Question

我正在尝试建立一个vite网站。我可以成功

npm run dev

并且一切正常，但是当我尝试构建它时，仅使用

index.html

和

/public

文件夹。我的整个 /src 被忽略。这是我当前的文件组织：

.
├── dist
├── index.html
├── node_modules
├── package-lock.json
├── package.json
├── public
│   ├── fonts
│   ├── gif
│   └── icons
├── readme.md
├── src
│   ├── html
│   ├── js
│   ├── scss
│   └── vite-env.d.ts

我的package.json的内容

  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },

vite 项目就是这样组织的吗？
如何构建我的项目以便包含我的 src 文件夹（包含我所有的样式、js 和其他页面）？ （是的，我已经阅读了更改 Vite 中的输入和输出目录以及其他 StackOverflow 帖子以及 vite 配置文档，但我迷失了）

Answer 1

在典型的 Vite 项目中，/src 文件夹的内容（如 HTML、JS 和 SCSS 文件）在构建过程中会被处理并捆绑到 dist 目录中。仅包含您的 index.html 和 /public 文件夹这一事实表明 Vite 无法正确识别或处理您的源文件。

您可以检查或尝试以下几件事：

确保正确的导入路径：确保您的index.html 文件正确引用/src 目录中的文件。例如，JavaScript 和 CSS 文件的路径应该相对于根目录，例如 src/js/main.js。

检查 Vite 配置：如果您有 vite.config.js 文件，请确保它已正确配置以处理您的源文件。您可能需要指定根目录或确保 Vite 正确处理您的资源。

文件扩展名：Vite 默认情况下可能不处理某些扩展名的文件。如果您使用非标准文件扩展名，请确保 Vite 配置为可以处理它们，或者您使用的是正确的 Vite 插件。

Vite 插件：如果您使用 SCSS、TypeScript 或其他预处理器，请确保安装和配置必要的 Vite 插件。

构建输出验证：运行 npm run build 后，检查 dist 目录以查看是否存在已处理的 JavaScript 和 CSS 文件。它们应该捆绑在一起，通常使用散列文件名。