chore(release): v0.16.11

.github/actions/setup/action.yml

@@ -4,7 +4,7 @@ runs:
   using: composite
   steps:
     - name: Setup PNPM
-      uses: pnpm/action-setup@v2
+      uses: pnpm/action-setup@v3
       with:
         version: 8
     - name: Setup NodeJS

.github/workflows/release.yml

@@ -5,6 +5,7 @@ on:
 jobs:
   validate:
     uses: './.github/workflows/validate.yml'
+    secrets: inherit
 
   publish:
     runs-on: ubuntu-22.04

.github/workflows/sync-releases.yml

@@ -12,7 +12,7 @@ jobs:
     runs-on: ubuntu-22.04
     steps:
       - uses: actions/checkout@v4
-      - uses: pnpm/action-setup@v2
+      - uses: pnpm/action-setup@v3
         with:
           version: 8
       - uses: actions/setup-node@v4

CHANGELOG.md

@@ -1,5 +1,22 @@
 # Changelog
 
+## v0.16.11
+
+[compare changes](https://github.com/wxt-dev/wxt/compare/v0.16.10...v0.16.11)
+
+### 🩹 Fixes
+
+- Output main JS file for HTML entrypoints to chunks directory ([#473](https://github.com/wxt-dev/wxt/pull/473))
+
+### 🏡 Chore
+
+- **e2e:** Remove log ([4fda203](https://github.com/wxt-dev/wxt/commit/4fda203))
+
+### 🤖 CI
+
+- Fix codecov warning in release workflow ([7c6973f](https://github.com/wxt-dev/wxt/commit/7c6973f))
+- Upgrade `pnpm/action-setup` to v2 ([905bfc7](https://github.com/wxt-dev/wxt/commit/905bfc7))
+
 ## v0.16.10
 
 [compare changes](https://github.com/wxt-dev/wxt/compare/v0.16.9...v0.16.10)

e2e/tests/analysis.test.ts

@@ -84,7 +84,6 @@ describe('Analysis', () => {
         keepArtifacts: true,
       },
     });
-    console.log(project.root);
 
     expect(await project.fileExists('stats/bundle.html')).toBe(true);
     expect(await project.fileExists('stats/bundle-0.json')).toBe(true);

package.json

@@ -1,7 +1,7 @@
 {
   "name": "wxt",
   "type": "module",
-  "version": "0.16.10",
+  "version": "0.16.11",
   "description": "Next gen framework for developing web extensions",
   "engines": {
     "node": ">=18",

src/core/builders/vite/index.ts

@@ -10,7 +10,10 @@ import {
   WxtBuilderServer,
 } from '~/types';
 import * as wxtPlugins from './plugins';
-import { getEntrypointBundlePath } from '~/core/utils/entrypoints';
+import {
+  getEntrypointBundlePath,
+  isHtmlEntrypoint,
+} from '~/core/utils/entrypoints';
 
 export async function createViteBuilder(
   inlineConfig: InlineConfig,
@@ -133,6 +136,9 @@ export async function createViteBuilder(
    * Return the basic config for building multiple entrypoints in [multi-page mode](https://vitejs.dev/guide/build.html#multi-page-app).
    */
   const getMultiPageConfig = (entrypoints: Entrypoint[]): vite.InlineConfig => {
+    const htmlEntrypoints = new Set(
+      entrypoints.filter(isHtmlEntrypoint).map((e) => e.name),
+    );
     return {
       mode: wxtConfig.mode,
       plugins: [
@@ -148,10 +154,12 @@ export async function createViteBuilder(
           output: {
             // Include a hash to prevent conflicts
             chunkFileNames: 'chunks/[name]-[hash].js',
-            // Place JS entrypoints in main directory without a hash. (popup.html & popup.js are
-            // next to each other). The unique entrypoint name requirement prevents conflicts with
-            // scripts of the same name
-            entryFileNames: '[name].js',
+            entryFileNames: ({ name }) => {
+              // HTML main JS files go in the chunks folder
+              if (htmlEntrypoints.has(name)) return 'chunks/[name]-[hash].js';
+              // Scripts are output in the root folder
+              return '[name].js';
+            },
             // We can't control the "name", so we need a hash to prevent conflicts
             assetFileNames: 'assets/[name]-[hash].[ext]',
           },

src/core/create-server.ts

@@ -5,7 +5,10 @@ import {
   ServerInfo,
   WxtDevServer,
 } from '~/types';
-import { getEntrypointBundlePath } from '~/core/utils/entrypoints';
+import {
+  getEntrypointBundlePath,
+  isHtmlEntrypoint,
+} from '~/core/utils/entrypoints';
 import {
   getContentScriptCssFiles,
   getContentScriptsCssMap,
@@ -248,9 +251,7 @@ function reloadHtmlPages(
   server: WxtDevServer,
 ): { reloadedNames: string[] } {
   // groups might contain other files like background/content scripts, and we only care about the HTMl pages
-  const htmlEntries = groups
-    .flat()
-    .filter((entry) => entry.inputPath.endsWith('.html'));
+  const htmlEntries = groups.flat().filter(isHtmlEntrypoint);
 
   htmlEntries.forEach((entry) => {
     const path = getEntrypointBundlePath(entry, wxt.config.outDir, '.html');

src/core/utils/building/generate-wxt-dir.ts

@@ -6,7 +6,10 @@ import {
 } from '~/types';
 import fs from 'fs-extra';
 import { relative, resolve } from 'path';
-import { getEntrypointBundlePath } from '~/core/utils/entrypoints';
+import {
+  getEntrypointBundlePath,
+  isHtmlEntrypoint,
+} from '~/core/utils/entrypoints';
 import { getEntrypointGlobals, getGlobals } from '~/core/utils/globals';
 import { normalizePath } from '~/core/utils/paths';
 import path from 'node:path';
@@ -82,7 +85,7 @@ async function writePathsDeclarationFile(
       getEntrypointBundlePath(
         entry,
         wxt.config.outDir,
-        entry.inputPath.endsWith('.html') ? '.html' : '.js',
+        isHtmlEntrypoint(entry) ? '.html' : '.js',
       ),
     )
     .concat(await getPublicFiles())

src/core/utils/entrypoints.ts

@@ -70,3 +70,12 @@ export function resolvePerBrowserOptions<
     ]),
   );
 }
+
+/**
+ * Returns true when the entrypoint is an HTML entrypoint.
+ *
+ * Naively just checking the file extension of the input path.
+ */
+export function isHtmlEntrypoint(entrypoint: Entrypoint): boolean {
+  return entrypoint.inputPath.endsWith('.html');
+}