diff --git a/package.json b/package.json
index 102d995..4ba79b8 100644
--- a/package.json
+++ b/package.json
@@ -40,11 +40,13 @@
"@biomejs/biome": "^1.9.4",
"@playwright/test": "^1.58.2",
"@rsbuild/core": "2.0.0-beta.4",
+ "@rsbuild/plugin-svelte": "^1.1.1",
"@rsdoctor/rspack-plugin": "^1.5.2",
"@rslib/core": "^0.19.5",
"@types/node": "^22.19.11",
"postcss": "^8.5.6",
"simple-git-hooks": "^2.13.1",
+ "svelte": "^5.55.0",
"tailwindcss": "^4.2.1",
"typescript": "^5.9.3"
},
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 583f4ab..ad60636 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -37,6 +37,9 @@ importers:
'@rsbuild/core':
specifier: 2.0.0-beta.4
version: 2.0.0-beta.4(core-js@3.47.0)
+ '@rsbuild/plugin-svelte':
+ specifier: ^1.1.1
+ version: 1.1.1(@rsbuild/core@2.0.0-beta.4(core-js@3.47.0))(postcss@8.5.6)(svelte@5.55.0)(typescript@5.9.3)
'@rsdoctor/rspack-plugin':
specifier: ^1.5.2
version: 1.5.2(@rsbuild/core@2.0.0-beta.4(core-js@3.47.0))(@rspack/core@1.7.6(@swc/helpers@0.5.18))(webpack@5.105.2)
@@ -52,6 +55,9 @@ importers:
simple-git-hooks:
specifier: ^2.13.1
version: 2.13.1
+ svelte:
+ specifier: ^5.55.0
+ version: 5.55.0
tailwindcss:
specifier: ^4.2.1
version: 4.2.1
@@ -278,6 +284,14 @@ packages:
'@rsbuild/core':
optional: true
+ '@rsbuild/plugin-svelte@1.1.1':
+ resolution: {integrity: sha512-maRgnSH/8nAJKl8yhQyf8W07kzz/tOCK8zZLpOIL7dP1j3Pxir7Uiy98ikPq3fWhPIBBtIzpmY8FUaR44t2CJA==}
+ peerDependencies:
+ '@rsbuild/core': ^1.4.0 || ^2.0.0-0
+ peerDependenciesMeta:
+ '@rsbuild/core':
+ optional: true
+
'@rsdoctor/client@1.5.2':
resolution: {integrity: sha512-fufNlCiA4+MDj3ZW8ssEdRI9mwawdqSSYvqOOK01+NNIg3TuQNgEdnF/QVGnkxKLgVXJCtUdOKaZtUq1bwnJVQ==}
@@ -464,6 +478,11 @@ packages:
'@socket.io/component-emitter@3.1.2':
resolution: {integrity: sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA==}
+ '@sveltejs/acorn-typescript@1.0.9':
+ resolution: {integrity: sha512-lVJX6qEgs/4DOcRTpo56tmKzVPtoWAaVbL4hfO7t7NVwl9AAXzQR6cihesW1BmNMPl+bK6dreu2sOKBP2Q9CIA==}
+ peerDependencies:
+ acorn: ^8.9.0
+
'@swc/helpers@0.5.18':
resolution: {integrity: sha512-TXTnIcNJQEKwThMMqBXsZ4VGAza6bvN4pa41Rkqoio6QBKMvo+5lexeTMScGCIxtzgQJzElcvIltani+adC5PQ==}
@@ -589,6 +608,13 @@ packages:
'@types/tapable@2.2.7':
resolution: {integrity: sha512-D6QzACV9vNX3r8HQQNTOnpG+Bv1rko+yEA82wKs3O9CQ5+XW7HI7TED17/UE7+5dIxyxZIWTxKbsBeF6uKFCwA==}
+ '@types/trusted-types@2.0.7':
+ resolution: {integrity: sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==}
+
+ '@typescript-eslint/types@8.57.2':
+ resolution: {integrity: sha512-/iZM6FnM4tnx9csuTxspMW4BOSegshwX5oBDznJ7S4WggL7Vczz5d2W11ecc4vRrQMQHXRSxzrCsyG5EsPPTbA==}
+ engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
'@webassemblyjs/ast@1.14.1':
resolution: {integrity: sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ==}
@@ -684,6 +710,14 @@ packages:
resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==}
engines: {node: '>=8'}
+ aria-query@5.3.1:
+ resolution: {integrity: sha512-Z/ZeOgVl7bcSYZ/u/rh0fOpvEpq//LZmdbkXyc7syVzjPAhfOa9ebsdTSjEBDU4vs5nC98Kfduj1uFo0qyET3g==}
+ engines: {node: '>= 0.4'}
+
+ axobject-query@4.1.0:
+ resolution: {integrity: sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==}
+ engines: {node: '>= 0.4'}
+
base64id@2.0.0:
resolution: {integrity: sha512-lGe34o6EHj9y3Kts9R4ZYs/Gr+6N7MCaMlIFA3F1R2O5/m7K06AxfSeO5530PEERE6/WyEg3lsuyw4GHlPZHog==}
engines: {node: ^4.5.0 || >= 5.9}
@@ -693,6 +727,9 @@ packages:
engines: {node: '>=6.0.0'}
hasBin: true
+ big.js@5.2.2:
+ resolution: {integrity: sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==}
+
browserslist-load-config@1.0.1:
resolution: {integrity: sha512-orLR5HAoQugQNVUXUwNd+GAAwl3H64KLIwoMFBNW0AbMSqX2Lxs4ZV2/5UoNrVQlQqF9ygychiu7Svr/99bLtg==}
@@ -715,6 +752,10 @@ packages:
resolution: {integrity: sha512-rNjApaLzuwaOTjCiT8lSDdGN1APCiqkChLMJxJPWLunPAt5fy8xgU9/jNOchV84wfIxrA0lRQB7oCT8jrn/wrQ==}
engines: {node: '>=6.0'}
+ clsx@2.1.1:
+ resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
+ engines: {node: '>=6'}
+
commander@2.20.3:
resolution: {integrity: sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==}
@@ -755,6 +796,9 @@ packages:
resolution: {integrity: sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==}
engines: {node: '>=8'}
+ devalue@5.6.4:
+ resolution: {integrity: sha512-Gp6rDldRsFh/7XuouDbxMH3Mx8GMCcgzIb1pDTvNyn8pZGQ22u+Wa+lGV9dQCltFQ7uVw0MhRyb8XDskNFOReA==}
+
dom-serializer@2.0.0:
resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==}
@@ -771,6 +815,10 @@ packages:
electron-to-chromium@1.5.302:
resolution: {integrity: sha512-sM6HAN2LyK82IyPBpznDRqlTQAtuSaO+ShzFiWTvoMJLHyZ+Y39r8VMfHzwbU8MVBzQ4Wdn85+wlZl2TLGIlwg==}
+ emojis-list@3.0.0:
+ resolution: {integrity: sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==}
+ engines: {node: '>= 4'}
+
engine.io-parser@5.2.3:
resolution: {integrity: sha512-HqD3yTBfnBxIrbnM1DoD6Pcq8NECnh8d4As1Qgh0z5Gg3jRRIqijury0CL3ghu/edArpUYiYqQiDUQBIs4np3Q==}
engines: {node: '>=10.0.0'}
@@ -814,6 +862,12 @@ packages:
resolution: {integrity: sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==}
engines: {node: '>=8.0.0'}
+ esm-env@1.2.2:
+ resolution: {integrity: sha512-Epxrv+Nr/CaL4ZcFGPJIYLWFom+YeV1DqMLHJoEd9SYRxNbaFruBwfEX/kkHUJf55j2+TUbmDcmuilbP1TmXHA==}
+
+ esrap@2.2.4:
+ resolution: {integrity: sha512-suICpxAmZ9A8bzJjEl/+rLJiDKC0X4gYWUxT6URAWBLvlXmtbZd5ySMu/N2ZGEtMCAmflUDPSehrP9BQcsGcSg==}
+
esrecurse@4.3.0:
resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
engines: {node: '>=4.0'}
@@ -866,6 +920,9 @@ packages:
htmlparser2@10.0.0:
resolution: {integrity: sha512-TwAZM+zE5Tq3lrEHvOlvwgj1XLWQCtaaibSN11Q+gGBAS7Y1uZSWwXXRe4iF6OXnaq1riyQAPFOBtYc77Mxq0g==}
+ is-reference@3.0.3:
+ resolution: {integrity: sha512-ixkJoqQvAP88E6wLydLGGqCJsrFUnqoH6HnaczB8XmDH1oaWU+xxdptvikTgaEhtZ53Ky6YXiBuUI2WXLMCwjw==}
+
jest-worker@27.5.1:
resolution: {integrity: sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg==}
engines: {node: '>= 10.13.0'}
@@ -886,6 +943,11 @@ packages:
json-stream-stringify@3.0.1:
resolution: {integrity: sha512-vuxs3G1ocFDiAQ/SX0okcZbtqXwgj1g71qE9+vrjJ2EkjKQlEFDAcUNRxRU8O+GekV4v5cM2qXP0Wyt/EMDBiQ==}
+ json5@2.2.3:
+ resolution: {integrity: sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==}
+ engines: {node: '>=6'}
+ hasBin: true
+
jsonfile@6.2.0:
resolution: {integrity: sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==}
@@ -971,6 +1033,13 @@ packages:
resolution: {integrity: sha512-IWqP2SCPhyVFTBtRcgMHdzlf9ul25NwaFx4wCEH/KjAXuuHY4yNjvPXsBokp8jCB936PyWRaPKUNh8NvylLp2Q==}
engines: {node: '>=6.11.5'}
+ loader-utils@2.0.4:
+ resolution: {integrity: sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==}
+ engines: {node: '>=8.9.0'}
+
+ locate-character@3.0.0:
+ resolution: {integrity: sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==}
+
magic-string@0.30.21:
resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
@@ -1109,6 +1178,61 @@ packages:
resolution: {integrity: sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==}
engines: {node: '>=10'}
+ svelte-dev-helper@1.1.9:
+ resolution: {integrity: sha512-oU+Xv7Dl4kRU2kdFjsoPLfJfnt5hUhsFUZtuzI3Ku/f2iAFZqBoEuXOqK3N9ngD4dxQOmN4OKWPHVi3NeAeAfQ==}
+
+ svelte-hmr@0.14.12:
+ resolution: {integrity: sha512-4QSW/VvXuqVcFZ+RhxiR8/newmwOCTlbYIezvkeN6302YFRE8cXy0naamHcjz8Y9Ce3ITTZtrHrIL0AGfyo61w==}
+ engines: {node: ^12.20 || ^14.13.1 || >= 16}
+ peerDependencies:
+ svelte: '>=3.19.0'
+
+ svelte-loader@3.2.4:
+ resolution: {integrity: sha512-e0HdDnkYH/MDx4/IfTSka5AOFg9yYJcPuoZJB5x0l60fkHjVjNvrrxr+rJegDG9J7ZymmdHt00/hdLw+QF299w==}
+ peerDependencies:
+ svelte: ^3.0.0 || ^4.0.0-next.0 || ^5.0.0-next.1
+
+ svelte-preprocess@6.0.3:
+ resolution: {integrity: sha512-PLG2k05qHdhmRG7zR/dyo5qKvakhm8IJ+hD2eFRQmMLHp7X3eJnjeupUtvuRpbNiF31RjVw45W+abDwHEmP5OA==}
+ engines: {node: '>= 18.0.0'}
+ peerDependencies:
+ '@babel/core': ^7.10.2
+ coffeescript: ^2.5.1
+ less: ^3.11.3 || ^4.0.0
+ postcss: ^7 || ^8
+ postcss-load-config: '>=3'
+ pug: ^3.0.0
+ sass: ^1.26.8
+ stylus: '>=0.55'
+ sugarss: ^2.0.0 || ^3.0.0 || ^4.0.0
+ svelte: ^4.0.0 || ^5.0.0-next.100 || ^5.0.0
+ typescript: ^5.0.0
+ peerDependenciesMeta:
+ '@babel/core':
+ optional: true
+ coffeescript:
+ optional: true
+ less:
+ optional: true
+ postcss:
+ optional: true
+ postcss-load-config:
+ optional: true
+ pug:
+ optional: true
+ sass:
+ optional: true
+ stylus:
+ optional: true
+ sugarss:
+ optional: true
+ typescript:
+ optional: true
+
+ svelte@5.55.0:
+ resolution: {integrity: sha512-SThllKq6TRMBwPtat7ASnm/9CDXnIhBR0NPGw0ujn2DVYx9rVwsPZxDaDQcYGdUz/3BYVsCzdq7pZarRQoGvtw==}
+ engines: {node: '>=18'}
+
tailwindcss@4.2.1:
resolution: {integrity: sha512-/tBrSQ36vCleJkAOsy9kbNTgaxvGbyOamC30PRePTQe/o1MFwEKHQk4Cn7BNGaPtjp+PuUrByJehM1hgxfq4sw==}
@@ -1200,6 +1324,9 @@ packages:
utf-8-validate:
optional: true
+ zimmerframe@1.1.4:
+ resolution: {integrity: sha512-B58NGBEoc8Y9MWWCQGl/gq9xBCe4IiKM0a2x7GZdQKOW5Exr8S1W24J6OgM1njK8xCRGvAJIL/MxXHf6SkmQKQ==}
+
snapshots:
'@alloc/quick-lru@5.2.0': {}
@@ -1390,6 +1517,25 @@ snapshots:
optionalDependencies:
'@rsbuild/core': 2.0.0-beta.4(core-js@3.47.0)
+ '@rsbuild/plugin-svelte@1.1.1(@rsbuild/core@2.0.0-beta.4(core-js@3.47.0))(postcss@8.5.6)(svelte@5.55.0)(typescript@5.9.3)':
+ dependencies:
+ svelte-loader: 3.2.4(svelte@5.55.0)
+ svelte-preprocess: 6.0.3(postcss@8.5.6)(svelte@5.55.0)(typescript@5.9.3)
+ optionalDependencies:
+ '@rsbuild/core': 2.0.0-beta.4(core-js@3.47.0)
+ transitivePeerDependencies:
+ - '@babel/core'
+ - coffeescript
+ - less
+ - postcss
+ - postcss-load-config
+ - pug
+ - sass
+ - stylus
+ - sugarss
+ - svelte
+ - typescript
+
'@rsdoctor/client@1.5.2': {}
'@rsdoctor/core@1.5.2(@rsbuild/core@2.0.0-beta.4(core-js@3.47.0))(@rspack/core@1.7.6(@swc/helpers@0.5.18))(webpack@5.105.2)':
@@ -1605,6 +1751,10 @@ snapshots:
'@socket.io/component-emitter@3.1.2': {}
+ '@sveltejs/acorn-typescript@1.0.9(acorn@8.16.0)':
+ dependencies:
+ acorn: 8.16.0
+
'@swc/helpers@0.5.18':
dependencies:
tslib: 2.8.1
@@ -1705,8 +1855,7 @@ snapshots:
'@types/estree@1.0.5': {}
- '@types/estree@1.0.8':
- optional: true
+ '@types/estree@1.0.8': {}
'@types/json-schema@7.0.15':
optional: true
@@ -1719,6 +1868,10 @@ snapshots:
dependencies:
tapable: 2.3.0
+ '@types/trusted-types@2.0.7': {}
+
+ '@typescript-eslint/types@8.57.2': {}
+
'@webassemblyjs/ast@1.14.1':
dependencies:
'@webassemblyjs/helper-numbers': 1.13.2
@@ -1857,10 +2010,16 @@ snapshots:
ansi-regex@5.0.1: {}
+ aria-query@5.3.1: {}
+
+ axobject-query@4.1.0: {}
+
base64id@2.0.0: {}
baseline-browser-mapping@2.10.0: {}
+ big.js@5.2.2: {}
+
browserslist-load-config@1.0.1: {}
browserslist-to-es-version@1.4.1:
@@ -1883,6 +2042,8 @@ snapshots:
chrome-trace-event@1.0.4:
optional: true
+ clsx@2.1.1: {}
+
commander@2.20.3:
optional: true
@@ -1909,6 +2070,8 @@ snapshots:
detect-libc@2.1.2: {}
+ devalue@5.6.4: {}
+
dom-serializer@2.0.0:
dependencies:
domelementtype: 2.3.0
@@ -1929,6 +2092,8 @@ snapshots:
electron-to-chromium@1.5.302: {}
+ emojis-list@3.0.0: {}
+
engine.io-parser@5.2.3: {}
engine.io@6.6.5:
@@ -1976,6 +2141,13 @@ snapshots:
estraverse: 4.3.0
optional: true
+ esm-env@1.2.2: {}
+
+ esrap@2.2.4:
+ dependencies:
+ '@jridgewell/sourcemap-codec': 1.5.5
+ '@typescript-eslint/types': 8.57.2
+
esrecurse@4.3.0:
dependencies:
estraverse: 5.3.0
@@ -2024,6 +2196,10 @@ snapshots:
domutils: 3.2.2
entities: 6.0.1
+ is-reference@3.0.3:
+ dependencies:
+ '@types/estree': 1.0.8
+
jest-worker@27.5.1:
dependencies:
'@types/node': 22.19.11
@@ -2043,6 +2219,8 @@ snapshots:
json-stream-stringify@3.0.1: {}
+ json5@2.2.3: {}
+
jsonfile@6.2.0:
dependencies:
universalify: 2.0.1
@@ -2103,6 +2281,14 @@ snapshots:
loader-runner@4.3.1:
optional: true
+ loader-utils@2.0.4:
+ dependencies:
+ big.js: 5.2.2
+ emojis-list: 3.0.0
+ json5: 2.2.3
+
+ locate-character@3.0.0: {}
+
magic-string@0.30.21:
dependencies:
'@jridgewell/sourcemap-codec': 1.5.5
@@ -2238,6 +2424,45 @@ snapshots:
has-flag: 4.0.0
optional: true
+ svelte-dev-helper@1.1.9: {}
+
+ svelte-hmr@0.14.12(svelte@5.55.0):
+ dependencies:
+ svelte: 5.55.0
+
+ svelte-loader@3.2.4(svelte@5.55.0):
+ dependencies:
+ loader-utils: 2.0.4
+ svelte: 5.55.0
+ svelte-dev-helper: 1.1.9
+ svelte-hmr: 0.14.12(svelte@5.55.0)
+
+ svelte-preprocess@6.0.3(postcss@8.5.6)(svelte@5.55.0)(typescript@5.9.3):
+ dependencies:
+ svelte: 5.55.0
+ optionalDependencies:
+ postcss: 8.5.6
+ typescript: 5.9.3
+
+ svelte@5.55.0:
+ dependencies:
+ '@jridgewell/remapping': 2.3.5
+ '@jridgewell/sourcemap-codec': 1.5.5
+ '@sveltejs/acorn-typescript': 1.0.9(acorn@8.16.0)
+ '@types/estree': 1.0.8
+ '@types/trusted-types': 2.0.7
+ acorn: 8.16.0
+ aria-query: 5.3.1
+ axobject-query: 4.1.0
+ clsx: 2.1.1
+ devalue: 5.6.4
+ esm-env: 1.2.2
+ esrap: 2.2.4
+ is-reference: 3.0.3
+ locate-character: 3.0.0
+ magic-string: 0.30.21
+ zimmerframe: 1.1.4
+
tailwindcss@4.2.1: {}
tapable@2.2.3: {}
@@ -2323,3 +2548,5 @@ snapshots:
optional: true
ws@8.18.3: {}
+
+ zimmerframe@1.1.4: {}
diff --git a/src/index.ts b/src/index.ts
index 7bbba99..dc8bb26 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -171,16 +171,35 @@ export const pluginTailwindCSS = (
// 1. Inject
api.transform(
{
- test: { and: [/\.(jsx?|tsx?)$/, { not: [/node_modules/] }] },
+ test: { and: [/\.(jsx?|tsx?|svelte)$/, { not: [/node_modules/] }] },
},
({ code, resourcePath }) => {
const params = new URLSearchParams({
path: resourcePath,
});
- return `\
-import "${pathToFileURL(VIRTUAL_UTILITIES_ID)}?${params.toString()}";
-${code}`;
+ const importStr = `import "${pathToFileURL(VIRTUAL_UTILITIES_ID)}?${params.toString()}";\n`;
+
+ if (resourcePath.endsWith('.svelte')) {
+ // Find the first \n${code}`;
+ }
+
+ return importStr + code;
},
);
diff --git a/test/svelte-support/index.html b/test/svelte-support/index.html
new file mode 100644
index 0000000..a9b3a77
--- /dev/null
+++ b/test/svelte-support/index.html
@@ -0,0 +1,10 @@
+
+
+
+
+ Svelte Test
+
+
+
+
+
\ No newline at end of file
diff --git a/test/svelte-support/index.test.ts b/test/svelte-support/index.test.ts
new file mode 100644
index 0000000..84f6e95
--- /dev/null
+++ b/test/svelte-support/index.test.ts
@@ -0,0 +1,39 @@
+import { dirname } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { expect, test } from '@playwright/test';
+import { createRsbuild } from '@rsbuild/core';
+import { pluginSvelte } from '@rsbuild/plugin-svelte';
+import { pluginTailwindCSS } from '../../src';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+
+test('should build Svelte components with tailwind utilities', async ({
+ page,
+}) => {
+ const rsbuild = await createRsbuild({
+ cwd: __dirname,
+ rsbuildConfig: {
+ plugins: [pluginSvelte(), pluginTailwindCSS()],
+ html: {
+ template: './index.html',
+ },
+ },
+ });
+
+ await rsbuild.build();
+ const { server, urls } = await rsbuild.preview();
+
+ await page.goto(urls[0]);
+
+ const locator = page.locator('#test');
+ await expect(locator).toHaveCSS('text-align', 'center');
+ await expect(locator).toHaveCSS('font-weight', '700');
+
+ // get the color correctly (rgb(239, 68, 68) is red-500)
+ const color = await locator.evaluate(
+ (el) => window.getComputedStyle(el).color,
+ );
+ expect(color).toMatch(/lab\(|oklch\(|color\(|rgb\(/);
+
+ await server.close();
+});
diff --git a/test/svelte-support/src/App.svelte b/test/svelte-support/src/App.svelte
new file mode 100644
index 0000000..facec50
--- /dev/null
+++ b/test/svelte-support/src/App.svelte
@@ -0,0 +1,7 @@
+
+
+
+ {text}
+
\ No newline at end of file
diff --git a/test/svelte-support/src/index.js b/test/svelte-support/src/index.js
new file mode 100644
index 0000000..1dd3ffd
--- /dev/null
+++ b/test/svelte-support/src/index.js
@@ -0,0 +1,8 @@
+import { mount } from 'svelte';
+import App from './App.svelte';
+
+const app = mount(App, {
+ target: document.getElementById('root'),
+});
+
+export default app;