feat(compiler): add normalizeCssUrlValue function to standardize URL handling in styles and update tests accordingly

Author: dos1in

fe/packages/compiler/__tests__/style-compiler.spec.js

@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest'
-import { ensureImportSemicolons, normalizeRootStyleImports, removeBaseComponentScope, resolveStyleImportPath } from '../src/core/style-compiler'
+import { ensureImportSemicolons, normalizeCssUrlValue, normalizeRootStyleImports, removeBaseComponentScope, resolveStyleImportPath } from '../src/core/style-compiler'
 
 describe('ensureImportSemicolons', () => {
 	it('should add semicolons to @import statements that do not have them', () => {
@@ -234,3 +234,15 @@ describe('style import path helpers', () => {
 		expect(result).not.toContain('@import "/variable.less";')
 	})
 })
+
+describe('normalizeCssUrlValue', () => {
+	it('应该将协议相对 URL 规范化为 https', () => {
+		const input = 'url(//at.alicdn.com/iconfont.woff2?t=1)'
+		expect(normalizeCssUrlValue(input, '/tmp/app/pages/index.wxss')).toBe('url(https://at.alicdn.com/iconfont.woff2?t=1)')
+	})
+
+	it('应该保留 https URL 不变', () => {
+		const input = 'url("https://example.com/a.png")'
+		expect(normalizeCssUrlValue(input, '/tmp/app/pages/index.wxss')).toBe(input)
+	})
+})

fe/packages/compiler/src/core/style-compiler.js

@@ -204,30 +204,18 @@ async function enhanceCSS(module) {
 					}
 				})
 			}).processSync(node.selector)
-
-			// 处理样式声明
-			node.walkDecls((decl) => {
-				const match = decl.value.match(/url\("([^"]*)"\)/)
-				if (match) {
-					const imgSrc = match[1].trim()
-					// Skip processing if it's a data:image resource
-					if (imgSrc.startsWith('data:image')) {
-						return
-					}
-					const realSrc = collectAssets(getWorkPath(), absolutePath, imgSrc, getTargetPath(), getAppId())
-					decl.value = `url(${realSrc})`
-				}
-				else {
-					decl.value = transformRpx(decl.value)
-				}
-			})
 		}
 		else if (node.type === 'comment') {
 			// 移除注释
 			node.remove()
 		}
 	})
 
+	ast.walkDecls((decl) => {
+		decl.value = normalizeCssUrlValue(decl.value, absolutePath)
+		decl.value = transformRpx(decl.value)
+	})
+
 	const cssCode = ast.toResult().css
 
 	// 样式隔离
@@ -259,6 +247,27 @@ async function enhanceCSS(module) {
 	return result
 }
 
+function normalizeCssUrlValue(value, absolutePath) {
+	return value.replace(/url\(([^)]+)\)/g, (fullMatch, rawUrl) => {
+		const cleanedUrl = rawUrl.trim().replace(/^['"]|['"]$/g, '')
+
+		if (!cleanedUrl || cleanedUrl.startsWith('data:image')) {
+			return fullMatch
+		}
+
+		if (cleanedUrl.startsWith('//')) {
+			return `url(https:${cleanedUrl})`
+		}
+
+		if (/^(https?:|blob:|data:)/.test(cleanedUrl)) {
+			return fullMatch
+		}
+
+		const realSrc = collectAssets(getWorkPath(), absolutePath, cleanedUrl, getTargetPath(), getAppId())
+		return `url(${realSrc})`
+	})
+}
+
 function getAbsolutePath(modulePath) {
 	const workPath = getWorkPath()
 	const src = modulePath.startsWith('/') ? modulePath : `/${modulePath}`
@@ -354,4 +363,4 @@ function processHostSelector(selector, moduleId) {
 		.replace(/:host(?=\.|#|:)/g, `[data-v-${moduleId}]`)
 }
 
-export { compileSS, ensureImportSemicolons, normalizeRootStyleImports, processHostSelector, removeBaseComponentScope, resolveStyleImportPath }
+export { compileSS, ensureImportSemicolons, normalizeCssUrlValue, normalizeRootStyleImports, processHostSelector, removeBaseComponentScope, resolveStyleImportPath }