Migrate from webpack to vite

.gitignore

@@ -79,6 +79,7 @@ cpu.out
 /yarn-error.log
 /npm-debug.log*
 /.pnpm-store
+/public/assets/.vite
 /public/assets/js
 /public/assets/css
 /public/assets/fonts
@@ -87,8 +88,6 @@ cpu.out
 /VERSION
 /.air
 
-# Files and folders that were previously generated
-/public/assets/img/webpack
 
 # Snapcraft
 /gitea_a*.txt

Dockerfile

@@ -1,5 +1,5 @@
 # syntax=docker/dockerfile:1
-# Build frontend on the native platform to avoid QEMU-related issues with esbuild/webpack
+# Build frontend on the native platform to avoid QEMU-related issues with nodejs ecosystem
 FROM --platform=$BUILDPLATFORM docker.io/library/golang:1.26-alpine3.23 AS frontend-build
 RUN apk --no-cache add build-base git nodejs pnpm
 WORKDIR /src

Dockerfile.rootless

@@ -1,5 +1,5 @@
 # syntax=docker/dockerfile:1
-# Build frontend on the native platform to avoid QEMU-related issues with esbuild/webpack
+# Build frontend on the native platform to avoid QEMU-related issues with nodejs ecosystem
 FROM --platform=$BUILDPLATFORM docker.io/library/golang:1.26-alpine3.23 AS frontend-build
 RUN apk --no-cache add build-base git nodejs pnpm
 WORKDIR /src

Makefile

@@ -120,10 +120,10 @@ LINUX_ARCHS ?= linux/amd64,linux/386,linux/arm-5,linux/arm-6,linux/arm64,linux/r
 GO_TEST_PACKAGES ?= $(filter-out $(shell $(GO) list code.gitea.io/gitea/models/migrations/...) code.gitea.io/gitea/tests/integration/migration-test code.gitea.io/gitea/tests code.gitea.io/gitea/tests/integration,$(shell $(GO) list ./... | grep -v /vendor/))
 MIGRATE_TEST_PACKAGES ?= $(shell $(GO) list code.gitea.io/gitea/models/migrations/...)
 
-WEBPACK_SOURCES := $(shell find web_src/js web_src/css -type f)
-WEBPACK_CONFIGS := webpack.config.ts tailwind.config.ts
-WEBPACK_DEST := public/assets/js/index.js public/assets/css/index.css
-WEBPACK_DEST_ENTRIES := public/assets/js public/assets/css public/assets/fonts
+FRONTEND_SOURCES := $(shell find web_src/js web_src/css -type f)
+FRONTEND_CONFIGS := vite.config.ts tailwind.config.ts
+FRONTEND_DEST := public/assets/.vite/manifest.json
+FRONTEND_DEST_ENTRIES := public/assets/js public/assets/css public/assets/fonts public/assets/.vite
 
 BINDATA_DEST_WILDCARD := modules/migration/bindata.* modules/public/bindata.* modules/options/bindata.* modules/templates/bindata.*
 
@@ -199,7 +199,7 @@ git-check:
 
 .PHONY: clean-all
 clean-all: clean ## delete backend, frontend and integration files
-	rm -rf $(WEBPACK_DEST_ENTRIES) node_modules
+	rm -rf $(FRONTEND_DEST_ENTRIES) node_modules
 
 .PHONY: clean
 clean: ## delete backend and integration files
@@ -380,9 +380,8 @@ watch: ## watch everything and continuously rebuild
 	@bash tools/watch.sh
 
 .PHONY: watch-frontend
-watch-frontend: node_modules ## watch frontend files and continuously rebuild
-	@rm -rf $(WEBPACK_DEST_ENTRIES)
-	NODE_ENV=development $(NODE_VARS) pnpm exec webpack --watch --progress
+watch-frontend: node_modules ## start vite dev server for frontend
+	NODE_ENV=development $(NODE_VARS) pnpm exec vite
 
 .PHONY: watch-backend
 watch-backend: ## watch backend files and continuously rebuild
@@ -645,7 +644,7 @@ install: $(wildcard *.go)
 build: frontend backend ## build everything
 
 .PHONY: frontend
-frontend: $(WEBPACK_DEST) ## build frontend files
+frontend: $(FRONTEND_DEST) ## build frontend files
 
 .PHONY: backend
 backend: generate-backend $(EXECUTABLE) ## build backend files
@@ -672,7 +671,7 @@ ifneq ($(and $(STATIC),$(findstring pam,$(TAGS))),)
 endif
 	CGO_ENABLED="$(CGO_ENABLED)" CGO_CFLAGS="$(CGO_CFLAGS)" $(GO) build $(GOFLAGS) $(EXTRA_GOFLAGS) -tags '$(TAGS)' -ldflags '-s -w $(EXTLDFLAGS) $(LDFLAGS)' -o $@
 
-$(EXECUTABLE_E2E): $(GO_SOURCES) $(WEBPACK_DEST)
+$(EXECUTABLE_E2E): $(GO_SOURCES) $(FRONTEND_DEST)
 	CGO_ENABLED=1 $(GO) build $(GOFLAGS) $(EXTRA_GOFLAGS) -tags '$(TEST_TAGS)' -ldflags '-s -w $(EXTLDFLAGS) $(LDFLAGS)' -o $@
 
 .PHONY: release
@@ -776,15 +775,15 @@ update-py: node_modules ## update py dependencies
 	uv sync
 	@touch .venv
 
-.PHONY: webpack
-webpack: $(WEBPACK_DEST) ## build webpack files
+.PHONY: vite
+vite: $(FRONTEND_DEST) ## build vite files
 
-$(WEBPACK_DEST): $(WEBPACK_SOURCES) $(WEBPACK_CONFIGS) pnpm-lock.yaml
+$(FRONTEND_DEST): $(FRONTEND_SOURCES) $(FRONTEND_CONFIGS) pnpm-lock.yaml
 	@$(MAKE) -s node_modules
-	@rm -rf $(WEBPACK_DEST_ENTRIES)
-	@echo "Running webpack..."
-	@BROWSERSLIST_IGNORE_OLD_DATA=true $(NODE_VARS) pnpm exec webpack
-	@touch $(WEBPACK_DEST)
+	@rm -rf $(FRONTEND_DEST_ENTRIES)
+	@echo "Running vite build..."
+	@$(NODE_VARS) pnpm exec vite build
+	@touch $(FRONTEND_DEST)
 
 .PHONY: svg
 svg: node_modules ## build svg files

eslint.config.ts

@@ -572,7 +572,11 @@ export default defineConfig([
       'no-restricted-exports': [0],
       'no-restricted-globals': [2, ...restrictedGlobals],
       'no-restricted-properties': [2, ...restrictedProperties],
-      'no-restricted-imports': [0],
+      'no-restricted-imports': [2, {paths: [
+        {name: 'jquery', message: 'Use the global $ instead', allowTypeImports: true},
+        {name: 'htmx.org', message: 'Use the global htmx instead', allowTypeImports: true},
+        {name: 'idiomorph/htmx', message: 'Loaded in globals.ts', allowTypeImports: true},
+      ]}],
       'no-restricted-syntax': [2, 'WithStatement', 'ForInStatement', 'LabeledStatement', 'SequenceExpression'],
       'no-return-assign': [0],
       'no-script-url': [2],
@@ -1014,6 +1018,6 @@ export default defineConfig([
   },
   {
     files: ['web_src/**/*'],
-    languageOptions: {globals: {...globals.browser, ...globals.webpack}},
+    languageOptions: {globals: {...globals.browser, ...globals.jquery, htmx: false}},
   },
 ]);

modules/graceful/server_http.go

@@ -12,7 +12,12 @@ import (
 
 func newHTTPServer(network, address, name string, handler http.Handler) (*Server, ServeFunction) {
 	server := NewServer(network, address, name)
+	protocols := http.Protocols{}
+	protocols.SetHTTP1(true)
+	protocols.SetHTTP2(true)            // HTTP/2 can only be used when Gitea is configured to use TLS
+	protocols.SetUnencryptedHTTP2(true) // Allow HTTP/2 without TLS, in case Gitea is behind a reverse proxy
 	httpServer := http.Server{
+		Protocols:   &protocols,
 		Handler:     handler,
 		BaseContext: func(net.Listener) context.Context { return GetManager().HammerContext() },
 	}

modules/markup/external/openapi.go

@@ -9,6 +9,7 @@ import (
 	"io"
 
 	"code.gitea.io/gitea/modules/markup"
+	"code.gitea.io/gitea/modules/public"
 	"code.gitea.io/gitea/modules/setting"
 	"code.gitea.io/gitea/modules/util"
 )
@@ -61,19 +62,17 @@ func (p *openAPIRenderer) Render(ctx *markup.RenderContext, input io.Reader, out
 <html>
 <head>
 	<meta name="viewport" content="width=device-width, initial-scale=1">
-	<link rel="stylesheet" href="%s/assets/css/swagger.css?v=%s">
+	<link rel="stylesheet" href="%s">
 </head>
 <body>
 	<div id="swagger-ui"><textarea class="swagger-spec-content" data-spec-filename="%s">%s</textarea></div>
-	<script src="%s/assets/js/swagger.js?v=%s"></script>
+	<script type="module" src="%s"></script>
 </body>
 </html>`,
-		setting.StaticURLPrefix,
-		setting.AssetVersion,
+		public.AssetURI("css/swagger.css"),
 		html.EscapeString(ctx.RenderOptions.RelativePath),
 		html.EscapeString(util.UnsafeBytesToString(content)),
-		setting.StaticURLPrefix,
-		setting.AssetVersion,
+		public.AssetURI("js/swagger.js"),
 	))
 	return err
 }

modules/markup/render.go

@@ -16,6 +16,7 @@ import (
 
 	"code.gitea.io/gitea/modules/htmlutil"
 	"code.gitea.io/gitea/modules/markup/internal"
+	"code.gitea.io/gitea/modules/public"
 	"code.gitea.io/gitea/modules/setting"
 	"code.gitea.io/gitea/modules/typesniffer"
 	"code.gitea.io/gitea/modules/util"
@@ -237,10 +238,10 @@ func RenderWithRenderer(ctx *RenderContext, renderer Renderer, input io.Reader,
 			return renderIFrame(ctx, extOpts.ContentSandbox, output)
 		}
 		// else: this is a standalone page, fallthrough to the real rendering, and add extra JS/CSS
-		extraStyleHref := setting.AppSubURL + "/assets/css/external-render-iframe.css"
-		extraScriptSrc := setting.AppSubURL + "/assets/js/external-render-iframe.js"
+		extraStyleHref := public.AssetURI("css/external-render-iframe.css")
+		extraScriptSrc := public.AssetURI("js/external-render-iframe.js")
 		// "<script>" must go before "<link>", to make Golang's http.DetectContentType() can still recognize the content as "text/html"
-		extraHeadHTML = htmlutil.HTMLFormat(`<script src="%s"></script><link rel="stylesheet" href="%s">`, extraScriptSrc, extraStyleHref)
+		extraHeadHTML = htmlutil.HTMLFormat(`<script type="module" src="%s"></script><link rel="stylesheet" href="%s">`, extraScriptSrc, extraStyleHref)
 	}
 
 	ctx.usedByRender = true

modules/public/manifest.go

@@ -0,0 +1,156 @@
+// Copyright 2026 The Gitea Authors. All rights reserved.
+// SPDX-License-Identifier: MIT
+
+package public
+
+import (
+	"io"
+	"path"
+	"sync"
+	"sync/atomic"
+	"time"
+
+	"code.gitea.io/gitea/modules/json"
+	"code.gitea.io/gitea/modules/log"
+	"code.gitea.io/gitea/modules/setting"
+)
+
+type manifestEntry struct {
+	File    string   `json:"file"`
+	Name    string   `json:"name"`
+	IsEntry bool     `json:"isEntry"`
+	CSS     []string `json:"css"`
+}
+
+type manifestDataStruct struct {
+	paths     map[string]string // unhashed path -> hashed path
+	names     map[string]string // hashed path -> entry name
+	modTime   int64
+	checkTime time.Time
+}
+
+var (
+	manifestData atomic.Pointer[manifestDataStruct]
+	manifestFS   = sync.OnceValue(AssetFS)
+)
+
+const manifestPath = "assets/.vite/manifest.json"
+
+func parseManifest(data []byte) (map[string]string, map[string]string) {
+	var manifest map[string]manifestEntry
+	if err := json.Unmarshal(data, &manifest); err != nil {
+		log.Error("Failed to parse frontend manifest: %v", err)
+		return nil, nil
+	}
+
+	paths := make(map[string]string)
+	names := make(map[string]string)
+	for _, entry := range manifest {
+		if !entry.IsEntry || entry.Name == "" {
+			continue
+		}
+		// Build unhashed key from file path: "js/index.js", "css/theme-gitea-dark.css"
+		dir := path.Dir(entry.File)
+		ext := path.Ext(entry.File)
+		key := dir + "/" + entry.Name + ext
+		paths[key] = entry.File
+		names[entry.File] = entry.Name
+		// Map associated CSS files, e.g. "css/index.css" -> "css/index.B3zrQPqD.css"
+		for _, css := range entry.CSS {
+			cssKey := path.Dir(css) + "/" + entry.Name + path.Ext(css)
+			paths[cssKey] = css
+			names[css] = entry.Name
+		}
+	}
+	return paths, names
+}
+
+func reloadManifest(existingData *manifestDataStruct) *manifestDataStruct {
+	now := time.Now()
+	data := existingData
+	if data != nil && now.Sub(data.checkTime) < time.Second {
+		// a single request triggers multiple calls to getHashedPath
+		// do not check the manifest file too frequently
+		return data
+	}
+
+	f, err := manifestFS().Open(manifestPath)
+	if err != nil {
+		log.Error("Failed to open frontend manifest: %v", err)
+		return data
+	}
+	defer f.Close()
+
+	fi, err := f.Stat()
+	if err != nil {
+		log.Error("Failed to stat frontend manifest: %v", err)
+		return data
+	}
+
+	needReload := data == nil || fi.ModTime().UnixNano() != data.modTime
+	if !needReload {
+		return data
+	}
+	manifestContent, err := io.ReadAll(f)
+	if err != nil {
+		log.Error("Failed to read frontend manifest: %v", err)
+		return data
+	}
+	return storeManifestFromBytes(manifestContent, fi.ModTime().UnixNano(), now)
+}
+
+func storeManifestFromBytes(manifestContent []byte, modTime int64, checkTime time.Time) *manifestDataStruct {
+	paths, names := parseManifest(manifestContent)
+	data := &manifestDataStruct{
+		paths:     paths,
+		names:     names,
+		modTime:   modTime,
+		checkTime: checkTime,
+	}
+	manifestData.Store(data)
+	return data
+}
+
+func getManifestData() *manifestDataStruct {
+	data := manifestData.Load()
+
+	// In production the manifest is immutable (embedded in the binary).
+	// In dev mode, check if it changed on disk (for watch-frontend).
+	if data == nil || !setting.IsProd {
+		data = reloadManifest(data)
+	}
+	if data == nil {
+		data = &manifestDataStruct{}
+	}
+	return data
+}
+
+// getHashedPath resolves an unhashed asset path (origin path) to its content-hashed path from the frontend manifest.
+// Example: getHashedPath("js/index.js") returns "js/index.C6Z2MRVQ.js"
+// Falls back to returning the input path unchanged if the manifest is unavailable.
+func getHashedPath(originPath string) string {
+	data := getManifestData()
+	if p, ok := data.paths[originPath]; ok {
+		return p
+	}
+	return originPath
+}
+
+// AssetURI returns the URI for a frontend asset.
+// It may return a relative path or a full URL depending on the StaticURLPrefix setting.
+// In Vite dev mode, known entry points are mapped to their source paths
+// so the reverse proxy serves them from the Vite dev server.
+// In production, it resolves the content-hashed path from the manifest.
+func AssetURI(originPath string) string {
+	if src := viteDevSourceURL(originPath); src != "" {
+		return src
+	}
+	return setting.StaticURLPrefix + "/assets/" + getHashedPath(originPath)
+}
+
+// AssetNameFromHashedPath returns the asset entry name for a given hashed asset path.
+// Example: returns "theme-gitea-dark" for "css/theme-gitea-dark.CyAaQnn5.css".
+// Returns empty string if the path is not found in the manifest.
+func AssetNameFromHashedPath(hashedPath string) string {
+	return getManifestData().names[hashedPath]
+}