Vite includes source files into the production bundle out of the box

vladmw5 commented 2 months ago

Describe the bug

I have created a brand new react-vite project using yarn create vite . --template=react-ts

When I launched the dev server, I found that in the Network tab all my source files like main.tsx and App.tsx are included, which is obviously undesirable due to security reasons. Newly created files are also included as ts files.

What I expect is that ts files should not be included, only the final minified js script

Reproduction

https://github.com/vladmw5/react-vite-ts-test

Steps to reproduce

Run yarn dev

Visit the local server

Open devtools (F12)

Open the Network tab

Toggle All and See *.tsx and *.ts files being fetched

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (16) x64 AMD Ryzen 7 5800H with Radeon Graphics
    Memory: 3.73 GB / 15.35 GB
  Binaries:
    Node: 20.13.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 10.5.2 - C:\Program Files\nodejs\npm.CMD
    pnpm: 8.9.0 - ~\AppData\Local\pnpm\pnpm.EXE
  Browsers:
    Edge: Chromium (126.0.2592.56)
    Internet Explorer: 11.0.22621.3527
  npmPackages:
    @vitejs/plugin-react: ^4.2.1 => 4.3.1
    vite: ^5.2.0 => 5.3.1

Used Package Manager

yarn

Logs

No response

Validations

[X] Follow our Code of Conduct
[X] Read the Contributing Guidelines.
[X] Read the docs.
[X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[X] Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
[X] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
[X] The provided reproduction is a minimal reproducible example of the bug.

bluwy commented 2 months ago

This is how Vite works fundamentally. In dev, the source files are served as is and transformed to JS. If you want to build them away, you need to build your project with vite build and preview it.

vrxrg commented 2 months ago

Thank you! So you claim that if experience this behaviour in production, that signifies that I run my prod with 'dev bundle' instead of the one generated by vite build?

bluwy commented 2 months ago

Yes, if you see that, you may be running the dev server and using that server as-is in prod, which will have many other issues. Not to be mistaken though with production sourcemaps, as they can display the file structure and original code in the sources tab (not the network tab).

vitejs / vite