Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

--experimental-html with --minify removes content in <head> #16335

Open
noClaps opened this issue Jan 11, 2025 · 0 comments
Open

--experimental-html with --minify removes content in <head> #16335

noClaps opened this issue Jan 11, 2025 · 0 comments
Labels
bug Something isn't working bundler Something to do with the bundler

Comments

@noClaps
Copy link

noClaps commented Jan 11, 2025

What version of Bun is running?

1.1.43+76800b049

What platform is your computer?

Darwin 24.2.0 arm64 arm

What steps can reproduce the bug?

  1. Create a project with an index.html, style.css and script.ts.

    <!-- index.html -->
<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="Page description" />
    <title>Page title</title>
    <link rel="stylesheet" href="./style.css" />
    <script src="./script.ts"></script>
  </head>
  <body>
    <h1>Hello World</h1>
  </body>
</html>
    /* style.css */
body {
  background-color: black;
  color: white;
}
    // script.ts
console.log("Hello World");

  2. Run bun build --experimental-html --experimental-css --minify index.html --outdir dist

  3. This will build all of the files and output them to the dist/ directory.

What is the expected behavior?

The expected output (unminified) is:

<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="Page description" />
    <title>Page title</title>
    <link rel="stylesheet" crossorigin href="./index-3e25yxv1.css" />
    <script type="module" crossorigin src="./index-jnggvq6y.js"></script>
  </head>
  <body>
    <h1>Hello World</h1>
  </body>
</html>

and the HTML should be minified properly, like so:

<!doctype html><html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><meta name="description" content="Page description" /><title>Page title</title><link rel="stylesheet" crossorigin href="./index-3e25yxv1.css" /><script type="module" crossorigin src="./index-jnggvq6y.js"></script></head><body><h1>Hello World</h1></body></html>

What do you see instead?

Instead, the output is:

<!doctype html>
<html>
  <head><link rel="stylesheet" crossorigin href="./index-3e25yxv1.css"><script type="module" crossorigin src="./index-jnggvq6y.js"></script></head>
  <body>
    <h1>Hello World</h1>
  </body>
</html>

All of the other content in is now gone, and the is unminified.

Additional information

This also happens with Bun.build, presumably because the CLI and programmatic API use the same code. However, the missing elements issue no longer happens if minify.whitespace is turned off and minify.syntax and minify.identifiers are turned on. The incorrect minification issue still happens in both cases.
@noClaps noClaps added bug Something isn't working needs triage labels Jan 11, 2025
@RiskyMH RiskyMH added bundler Something to do with the bundler and removed needs triage labels Jan 12, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working bundler Something to do with the bundler
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@RiskyMH @noClaps