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

'deep' is not recognized as a valid pseudo-class. Did you mean '::deep' (pseudo-element) or is this a typo #507

Open
7 tasks done
amir20 opened this issue Jan 17, 2025 · 3 comments
Open
7 tasks done

'deep' is not recognized as a valid pseudo-class. Did you mean '::deep' (pseudo-element) or is this a typo #507

amir20 opened this issue Jan 17, 2025 · 3 comments
Labels
p3-minor-bug 🔨 An edge case that only affects very specific usage (priority)

Comments

@amir20
Copy link

amir20 commented Jan 17, 2025 •
edited
Loading

Describe the bug

Starting with vite 6.x, I started getting the following errors when using lightningcss:

[vite:css][lightningcss] 'deep' is not recognized as a valid pseudo-class. Did you mean '::deep' (pseudo-element) or is this a typo?
18 |    }
19 |
20 |    :deep(.wave:nth-of-type(4)) {
   |          ^
21 |      fill: #0fb9b1;
22 |    }

This has been discussed in parcel-bundler/lightningcss#871 (comment)

Seems like Vite is processing css before Vue has processed the css.

Reproduction

https://stackblitz.com/edit/vitejs-vite-k5i7wfpr

Steps to reproduce

Pretty simple configuration:

import { defineConfig } from "vite";
import Vue from "@vitejs/plugin-vue";
import SVGLoader from "vite-svg-loader";
import UnoCSS from "unocss/vite";
import WebfontDownload from "vite-plugin-webfont-dl";

export default defineConfig({
  css: {
    transformer: "lightningcss",
  },
  plugins: [Vue(), UnoCSS(), SVGLoader(), WebfontDownload()],
});

System Info

System:
    OS: macOS 15.2
    CPU: (12) arm64 Apple M3 Pro
    Memory: 183.94 MB / 18.00 GB
    Shell: 3.7.1 - /opt/homebrew/bin/fish
  Binaries:
    Node: 23.2.0 - ~/.local/state/fnm_multishells/21576_1737139643781/bin/node
    npm: 10.9.0 - ~/.local/state/fnm_multishells/21576_1737139643781/bin/npm
    pnpm: 9.14.2 - ~/.local/state/fnm_multishells/21576_1737139643781/bin/pnpm
    bun: 1.1.45 - /opt/homebrew/bin/bun
  Browsers:
    Chrome: 131.0.6778.266
    Safari: 18.2
  npmPackages:
    @vitejs/plugin-vue: 5.2.1 => 5.2.1
    vite: 6.0.7 => 6.0.7

Used Package Manager

pnpm

Logs

Click to expand!

❯ pnpm vite build --debug 11:53:18
vite:config bundled config file loaded in 568.37ms +0ms
vite:config using resolved config: {
vite:config css: {
vite:config transformer: 'lightningcss',
vite:config preprocessorMaxWorkers: 0,
vite:config devSourcemap: false,
vite:config lightningcss: {
vite:config targets: {
vite:config chrome: 5242880,
vite:config edge: 5242880,
vite:config safari: 917504,
vite:config firefox: 5111808,
vite:config opera: 4390912
vite:config }
vite:config }
vite:config },
vite:config plugins: [
vite:config 'vite:build-metadata',
vite:config 'vite:watch-package-data',
vite:config 'vite:pre-alias',
vite:config 'alias',
vite:config 'unocss:transformers:pre',
vite:config 'unocss:global:build:scan',
vite:config 'unocss:global:content',
vite:config 'svg-loader',
vite:config 'vite:modulepreload-polyfill',
vite:config 'vite:resolve',
vite:config 'vite:html-inline-proxy',
vite:config 'vite:css',
vite:config 'vite:esbuild',
vite:config 'vite:json',
vite:config 'vite:wasm-helper',
vite:config 'vite:worker',
vite:config 'vite:asset',
vite:config 'vite:vue',
vite:config 'unocss:config',
vite:config 'unocss:transformers:undefined',
vite:config 'unocss:devtools',
vite:config 'unocss:api',
vite:config 'unocss:global:build:generate',
vite:config 'vite:wasm-fallback',
vite:config 'vite:define',
vite:config 'vite:css-post',
vite:config 'vite:build-html',
vite:config 'vite:worker-import-meta-url',
vite:config 'vite:asset-import-meta-url',
vite:config 'vite:force-systemjs-wrap-complete',
vite:config 'commonjs',
vite:config 'vite:data-uri',
vite:config 'vite:rollup-options-plugins',
vite:config 'vite:dynamic-import-vars',
vite:config 'vite:import-glob',
vite:config 'unocss:transformers:post',
vite:config 'unocss:global:build:bundle',
vite:config 'vite-plugin-webfont-dl',
vite:config 'vite:build-import-analysis',
vite:config 'vite:esbuild-transpile',
vite:config 'vite:terser',
vite:config 'vite:manifest',
vite:config 'vite:ssr-manifest',
vite:config 'vite:reporter',
vite:config 'vite:load-fallback'
vite:config ],
vite:config build: {
vite:config target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
vite:config polyfillModulePreload: true,
vite:config modulePreload: { polyfill: true },
vite:config outDir: 'dist',
vite:config assetsDir: 'assets',
vite:config assetsInlineLimit: 4096,
vite:config sourcemap: false,
vite:config terserOptions: {},
vite:config rollupOptions: {},
vite:config commonjsOptions: { include: [ /node_modules/ ], extensions: [ '.js', '.cjs' ] },
vite:config dynamicImportVarsOptions: { warnOnError: true, exclude: [ /node_modules/ ] },
vite:config write: true,
vite:config emptyOutDir: null,
vite:config copyPublicDir: true,
vite:config manifest: false,
vite:config lib: false,
vite:config ssrManifest: false,
vite:config ssrEmitAssets: false,
vite:config reportCompressedSize: true,
vite:config chunkSizeWarningLimit: 500,
vite:config watch: null,
vite:config cssCodeSplit: true,
vite:config minify: 'esbuild',
vite:config ssr: false,
vite:config emitAssets: true,
vite:config createEnvironment: [Function: createEnvironment],
vite:config cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
vite:config cssMinify: true
vite:config },
vite:config resolve: {
vite:config externalConditions: [ 'node' ],
vite:config extensions: [ '.mjs', '.js', '.ts', '.jsx', '.tsx', '.json' ],
vite:config dedupe: [ 'vue' ],
vite:config noExternal: [],
vite:config external: [],
vite:config preserveSymlinks: false,
vite:config alias: [
vite:config {
vite:config find: /^/?@vite/env/,
vite:config replacement: '/@fs/Users/araminfar/Workspace/amir20.github.io/node_modules/.pnpm/[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/client/env.mjs'
vite:config },
vite:config {
vite:config find: /^/?@vite/client/,
vite:config replacement: '/@fs/Users/araminfar/Workspace/amir20.github.io/node_modules/.pnpm/[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/client/client.mjs'
vite:config }
vite:config ],
vite:config mainFields: [ 'module', 'jsnext:main', 'jsnext' ],
vite:config conditions: [ 'module', 'node', 'development|production' ],
vite:config enableBuiltinNoExternalCheck: false
vite:config },
vite:config define: {
vite:config VUE_OPTIONS_API: true,
vite:config VUE_PROD_DEVTOOLS: false,
vite:config VUE_PROD_HYDRATION_MISMATCH_DETAILS: false
vite:config },
vite:config ssr: {
vite:config target: 'node',
vite:config optimizeDeps: {
vite:config esbuildOptions: { preserveSymlinks: false },
vite:config include: [],
vite:config exclude: [],
vite:config needsInterop: [],
vite:config extensions: [],
vite:config holdUntilCrawlEnd: true,
vite:config force: false,
vite:config noDiscovery: true
vite:config },
vite:config external: [],
vite:config noExternal: [],
vite:config resolve: {
vite:config conditions: [ 'module', 'node', 'development|production' ],
vite:config externalConditions: [ 'node' ]
vite:config }
vite:config },
vite:config environments: {
vite:config client: {
vite:config define: {
vite:config VUE_OPTIONS_API: true,
vite:config VUE_PROD_DEVTOOLS: false,
vite:config VUE_PROD_HYDRATION_MISMATCH_DETAILS: false
vite:config },
vite:config resolve: {
vite:config externalConditions: [ 'node' ],
vite:config extensions: [ '.mjs', '.js', '.ts', '.jsx', '.tsx', '.json' ],
vite:config dedupe: [ 'vue' ],
vite:config noExternal: [],
vite:config external: [],
vite:config preserveSymlinks: false,
vite:config alias: [
vite:config {
vite:config find: /^/?@vite/env/,
vite:config replacement: '/@fs/Users/araminfar/Workspace/amir20.github.io/node_modules/.pnpm/[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/client/env.mjs'
vite:config },
vite:config {
vite:config find: /^/?@vite/client/,
vite:config replacement: '/@fs/Users/araminfar/Workspace/amir20.github.io/node_modules/.pnpm/[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/client/client.mjs'
vite:config }
vite:config ],
vite:config mainFields: [ 'browser', 'module', 'jsnext:main', 'jsnext' ],
vite:config conditions: [ 'module', 'browser', 'development|production' ],
vite:config enableBuiltinNoExternalCheck: false
vite:config },
vite:config keepProcessEnv: false,
vite:config consumer: 'client',
vite:config optimizeDeps: {
vite:config include: [],
vite:config exclude: [],
vite:config needsInterop: [],
vite:config extensions: [],
vite:config disabled: undefined,
vite:config holdUntilCrawlEnd: true,
vite:config force: false,
vite:config noDiscovery: false,
vite:config esbuildOptions: { preserveSymlinks: false }
vite:config },
vite:config dev: {
vite:config warmup: [],
vite:config sourcemap: { js: true },
vite:config sourcemapIgnoreList: [Function: isInNodeModules$1],
vite:config preTransformRequests: true,
vite:config createEnvironment: [Function: defaultCreateClientDevEnvironment],
vite:config recoverable: true,
vite:config moduleRunnerTransform: false
vite:config },
vite:config build: {
vite:config target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
vite:config polyfillModulePreload: true,
vite:config modulePreload: { polyfill: true },
vite:config outDir: 'dist',
vite:config assetsDir: 'assets',
vite:config assetsInlineLimit: 4096,
vite:config sourcemap: false,
vite:config terserOptions: {},
vite:config rollupOptions: {},
vite:config commonjsOptions: { include: [ /node_modules/ ], extensions: [ '.js', '.cjs' ] },
vite:config dynamicImportVarsOptions: { warnOnError: true, exclude: [ /node_modules/ ] },
vite:config write: true,
vite:config emptyOutDir: null,
vite:config copyPublicDir: true,
vite:config manifest: false,
vite:config lib: false,
vite:config ssrManifest: false,
vite:config ssrEmitAssets: false,
vite:config reportCompressedSize: true,
vite:config chunkSizeWarningLimit: 500,
vite:config watch: null,
vite:config cssCodeSplit: true,
vite:config minify: 'esbuild',
vite:config ssr: false,
vite:config emitAssets: true,
vite:config createEnvironment: [Function: createEnvironment],
vite:config cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
vite:config cssMinify: true
vite:config }
vite:config },
vite:config ssr: {
vite:config define: {
vite:config VUE_OPTIONS_API: true,
vite:config VUE_PROD_DEVTOOLS: false,
vite:config VUE_PROD_HYDRATION_MISMATCH_DETAILS: false
vite:config },
vite:config resolve: {
vite:config externalConditions: [ 'node' ],
vite:config extensions: [ '.mjs', '.js', '.ts', '.jsx', '.tsx', '.json' ],
vite:config dedupe: [ 'vue' ],
vite:config noExternal: [],
vite:config external: [],
vite:config preserveSymlinks: false,
vite:config alias: [
vite:config {
vite:config find: /^/?@vite/env/,
vite:config replacement: '/@fs/Users/araminfar/Workspace/amir20.github.io/node_modules/.pnpm/[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/client/env.mjs'
vite:config },
vite:config {
vite:config find: /^/?@vite/client/,
vite:config replacement: '/@fs/Users/araminfar/Workspace/amir20.github.io/node_modules/.pnpm/[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/client/client.mjs'
vite:config }
vite:config ],
vite:config mainFields: [ 'module', 'jsnext:main', 'jsnext' ],
vite:config conditions: [ 'module', 'node', 'development|production' ],
vite:config enableBuiltinNoExternalCheck: false
vite:config },
vite:config keepProcessEnv: true,
vite:config consumer: 'server',
vite:config optimizeDeps: {
vite:config include: [],
vite:config exclude: [],
vite:config needsInterop: [],
vite:config extensions: [],
vite:config disabled: undefined,
vite:config holdUntilCrawlEnd: true,
vite:config force: false,
vite:config noDiscovery: true,
vite:config esbuildOptions: { preserveSymlinks: false }
vite:config },
vite:config dev: {
vite:config warmup: [],
vite:config sourcemap: { js: true },
vite:config sourcemapIgnoreList: [Function: isInNodeModules$1],
vite:config preTransformRequests: false,
vite:config createEnvironment: [Function: defaultCreateDevEnvironment],
vite:config recoverable: false,
vite:config moduleRunnerTransform: true
vite:config },
vite:config build: {
vite:config target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
vite:config polyfillModulePreload: true,
vite:config modulePreload: { polyfill: true },
vite:config outDir: 'dist',
vite:config assetsDir: 'assets',
vite:config assetsInlineLimit: 4096,
vite:config sourcemap: false,
vite:config terserOptions: {},
vite:config rollupOptions: {},
vite:config commonjsOptions: { include: [ /node_modules/ ], extensions: [ '.js', '.cjs' ] },
vite:config dynamicImportVarsOptions: { warnOnError: true, exclude: [ /node_modules/ ] },
vite:config write: true,
vite:config emptyOutDir: null,
vite:config copyPublicDir: true,
vite:config manifest: false,
vite:config lib: false,
vite:config ssrManifest: false,
vite:config ssrEmitAssets: false,
vite:config reportCompressedSize: true,
vite:config chunkSizeWarningLimit: 500,
vite:config watch: null,
vite:config cssCodeSplit: true,
vite:config minify: false,
vite:config ssr: true,
vite:config emitAssets: true,
vite:config createEnvironment: [Function: createEnvironment],
vite:config cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
vite:config cssMinify: 'esbuild'
vite:config }
vite:config }
vite:config },
vite:config configFile: '/Users/araminfar/Workspace/amir20.github.io/vite.config.ts',
vite:config configFileDependencies: [ '/Users/araminfar/Workspace/amir20.github.io/vite.config.ts' ],
vite:config inlineConfig: {
vite:config root: undefined,
vite:config base: undefined,
vite:config mode: undefined,
vite:config configFile: undefined,
vite:config logLevel: undefined,
vite:config clearScreen: undefined,
vite:config build: {}
vite:config },
vite:config root: '/Users/araminfar/Workspace/amir20.github.io',
vite:config base: '/',
vite:config decodedBase: '/',
vite:config rawBase: '/',
vite:config publicDir: '/Users/araminfar/Workspace/amir20.github.io/public',
vite:config cacheDir: '/Users/araminfar/Workspace/amir20.github.io/node_modules/.vite',
vite:config command: 'build',
vite:config mode: 'production',
vite:config isWorker: false,
vite:config mainConfig: null,
vite:config bundleChain: [],
vite:config isProduction: true,
vite:config json: { namedExports: true, stringify: 'auto' },
vite:config esbuild: { jsxDev: false },
vite:config server: {
vite:config port: 5173,
vite:config strictPort: false,
vite:config host: undefined,
vite:config https: undefined,
vite:config open: false,
vite:config proxy: undefined,
vite:config cors: true,
vite:config headers: {},
vite:config warmup: { clientFiles: [], ssrFiles: [] },
vite:config middlewareMode: false,
vite:config fs: {
vite:config strict: true,
vite:config deny: [ '.env', '.env.', '.{crt,pem}', '/.git/' ],
vite:config allow: [ '/Users/araminfar/Workspace/amir20.github.io' ]
vite:config },
vite:config preTransformRequests: true,
vite:config perEnvironmentStartEndDuringDev: false,
vite:config sourcemapIgnoreList: [Function: isInNodeModules$1]
vite:config },
vite:config builder: undefined,
vite:config preview: {
vite:config port: 4173,
vite:config strictPort: false,
vite:config host: undefined,
vite:config https: undefined,
vite:config open: false,
vite:config proxy: undefined,
vite:config cors: true,
vite:config headers: {}
vite:config },
vite:config envDir: '/Users/araminfar/Workspace/amir20.github.io',
vite:config env: { BASE_URL: '/', MODE: 'production', DEV: false, PROD: true },
vite:config assetsInclude: [Function: assetsInclude],
vite:config logger: {
vite:config hasWarned: false,
vite:config info: [Function: info],
vite:config warn: [Function: warn],
vite:config warnOnce: [Function: warnOnce],
vite:config error: [Function: error],
vite:config clearScreen: [Function: clearScreen],
vite:config hasErrorLogged: [Function: hasErrorLogged]
vite:config },
vite:config packageCache: Map(1) {
vite:config 'fnpd_/Users/araminfar/Workspace/amir20.github.io' => {
vite:config dir: '/Users/araminfar/Workspace/amir20.github.io',
vite:config data: {
vite:config name: 'amirraminfar.me',
vite:config version: '0.0.0',
vite:config private: true,
vite:config type: 'module',
vite:config packageManager: '[email protected]',
vite:config scripts: {
vite:config build: 'cross-env NODE_ENV=production vite-ssg build',
vite:config dev: 'vite --open',
vite:config preview: 'vite preview'
vite:config },
vite:config devDependencies: {
vite:config critters: '^0.0.25',
vite:config 'http-server': '^14.1.1',
vite:config prettier: '^3.4.2'
vite:config },
vite:config dependencies: {
vite:config '@iconify-json/ph': '^1.2.2',
vite:config '@unocss/reset': '^65.4.2',
vite:config '@unocss/transformer-directives': '^65.4.2',
vite:config '@vitejs/plugin-vue': '5.2.1',
vite:config '@vue/compiler-sfc': '^3.5.13',
vite:config '@vue/server-renderer': '^3.5.13',
vite:config '@vueuse/head': '^2.0.0',
vite:config 'cross-env': '^7.0.3',
vite:config d3: '^7.9.0',
vite:config 'd3-selection': '^3.0.0',
vite:config 'd3-shape': '^3.2.0',
vite:config 'd3-timer': '^3.0.1',
vite:config lightningcss: '^1.29.1',
vite:config 'serve-static': '2.0.0-beta.2',
vite:config unocss: '^65.4.2',
vite:config 'unplugin-icons': '^22.0.0',
vite:config vite: '6.0.7',
vite:config 'vite-plugin-webfont-dl': '^3.10.4',
vite:config 'vite-ssg': '^25.0.0',
vite:config 'vite-svg-loader': '^5.1.0',
vite:config vue: '^3.5.13',
vite:config 'vue-router': '^4.5.0'
vite:config }
vite:config },
vite:config hasSideEffects: [Function: hasSideEffects],
vite:config setResolvedCache: [Function: setResolvedCache],
vite:config getResolvedCache: [Function: getResolvedCache]
vite:config },
vite:config set: [Function (anonymous)]
vite:config },
vite:config worker: { format: 'iife', plugins: '() => plugins', rollupOptions: {} },
vite:config appType: 'spa',
vite:config experimental: { importGlobRestoreExtension: false, hmrPartialAccept: false },
vite:config future: undefined,
vite:config optimizeDeps: {
vite:config include: [],
vite:config exclude: [],
vite:config needsInterop: [],
vite:config extensions: [],
vite:config disabled: undefined,
vite:config holdUntilCrawlEnd: true,
vite:config force: false,
vite:config noDiscovery: false,
vite:config esbuildOptions: { preserveSymlinks: false }
vite:config },
vite:config dev: {
vite:config warmup: [],
vite:config sourcemap: { js: true },
vite:config sourcemapIgnoreList: [Function: isInNodeModules$1],
vite:config preTransformRequests: false,
vite:config createEnvironment: [Function: defaultCreateDevEnvironment],
vite:config recoverable: false,
vite:config moduleRunnerTransform: false
vite:config },
vite:config getSortedPlugins: [Function: getSortedPlugins],
vite:config getSortedPluginHooks: [Function: getSortedPluginHooks],
vite:config createResolver: [Function: createResolver],
vite:config fsDenyGlob: [Function: arrayMatcher],
vite:config safeModulePaths: Set(0) {}
vite:config } +142ms
vite v6.0.7 building for production...
transforming (1) src/main.js[vite:css][lightningcss] 'deep' is not recognized as a valid pseudo-class. Did you mean '::deep' (pseudo-element) or is this a typo?
6 | bottom: -10px;
7 |
8 | :deep(.wave:nth-of-type(1)) {
| ^
9 | fill: #a55eea;
10 | }
[vite:css][lightningcss] 'deep' is not recognized as a valid pseudo-class. Did you mean '::deep' (pseudo-element) or is this a typo?
10 | }
11 |
12 | :deep(.wave:nth-of-type(2)) {
| ^
13 | fill: #fed330;
14 | }
[vite:css][lightningcss] 'deep' is not recognized as a valid pseudo-class. Did you mean '::deep' (pseudo-element) or is this a typo?
14 | }
15 |
16 | :deep(.wave:nth-of-type(3)) {
| ^
17 | fill: #45aaf2;
18 | }
[vite:css][lightningcss] 'deep' is not recognized as a valid pseudo-class. Did you mean '::deep' (pseudo-element) or is this a typo?
18 | }
19 |
20 | :deep(.wave:nth-of-type(4)) {
| ^
21 | fill: #0fb9b1;
22 | }
✓ 180 modules transformed.
✓ 1 webfont css downloaded. (14 ms, cache hit: 100.00%)
✓ 26 webfonts downloaded. (19 ms, cache hit: 100.00%)
dist/assets/favicon-DLpXBDQU.svg 0.81 kB │ gzip: 0.47 kB
dist/assets/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3CUBGEe-DnPa8eh0.woff2 4.34 kB
dist/assets/KFO5CnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmkCnkaWzU-Cf6Wh-ak.woff2 4.47 kB
dist/assets/nuFiD-vYSZviVYUb_rj3ij__anPXDTPYgFE_-DQ2yjD0Y.woff2 8.84 kB
dist/assets/nuFkD-vYSZviVYUb_rj3ij__anPXDTnojUk72xU-MV214wRY.woff2 9.49 kB
dist/assets/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3OUBGEe-CaxB3VTI.woff2 13.00 kB
dist/assets/KFO5CnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmkCXkaWzU-CEIe30GC.woff2 13.89 kB
dist/assets/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3-UBGEe-DAIrzMIp.woff2 17.63 kB
dist/assets/KFO5CnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmkBXkaWzU-BgJLMsj2.woff2 18.80 kB
dist/assets/nuFiD-vYSZviVYUb_rj3ij__anPXDTLYgFE_-CR05oQ3b.woff2 20.32 kB
dist/assets/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMaxKUBGEe-Bm5C9Z0M.woff2 20.41 kB
dist/assets/nuFiD-vYSZviVYUb_rj3ij__anPXDTjYgFE_-Dr2SnCEI.woff2 21.19 kB
dist/assets/KFO5CnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmkaHkaWzU-mQQU5nC4.woff2 22.29 kB
dist/assets/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3iUBGEe-B1tIhOr4.woff2 22.80 kB
dist/assets/nuFkD-vYSZviVYUb_rj3ij__anPXDTnojEk72xU-CQ1QqPi_.woff2 23.08 kB
dist/assets/nuFkD-vYSZviVYUb_rj3ij__anPXDTnohkk72xU-DWLruiEb.woff2 23.22 kB
dist/assets/KFO5CnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmkAnkaWzU-Cu0rrrwt.woff2 24.58 kB
dist/assets/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3KUBGEe-Dqr_DJ6L.woff2 26.43 kB
dist/assets/phantom-Bd9OZgBa.png 28.26 kB
dist/assets/KFO5CnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmkCHkaWzU-cqKqHPSO.woff2 28.54 kB
dist/assets/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3GUBGEe-mFIB_JhL.woff2 35.57 kB
dist/assets/nuFiD-vYSZviVYUb_rj3ij__anPXDTzYgA-BGlevZWC.woff2 38.37 kB
dist/assets/nuFkD-vYSZviVYUb_rj3ij__anPXDTnogkk7-C5iWh5y6.woff2 38.75 kB
dist/assets/KFO5CnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmkC3kaWzU-xZvC1bSU.woff2 39.46 kB
dist/assets/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3yUBA-CHnqiQTt.woff2 40.13 kB
dist/assets/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMawCUBGEe-SopRAUEK.woff2 40.57 kB
dist/assets/KFO5CnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmkBnka-HlDuTyNj.woff2 44.19 kB
dist/assets/KFO5CnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmkenkaWzU-CHxzkRUY.woff2 44.34 kB
dist/index.html 59.60 kB │ gzip: 3.01 kB
dist/assets/clashleaders-CP40Zzqb.png 63.09 kB
dist/assets/dozzle-BK1kuqZA.png 127.96 kB
dist/assets/Waves-CJBhKvnx.css 0.29 kB │ gzip: 0.15 kB
dist/assets/Home-CrHZMn77.css 0.45 kB │ gzip: 0.27 kB
dist/assets/index-CeEibNMz.css 16.47 kB │ gzip: 4.31 kB
dist/assets/vue.f36acd1f-_ZNy3boC.js 0.92 kB │ gzip: 0.54 kB
dist/assets/About-Dcd5HdCc.js 1.72 kB │ gzip: 1.01 kB
dist/assets/Home-pcMDf02V.js 1.91 kB │ gzip: 0.98 kB
dist/assets/Projects-BoJZhsmj.js 2.91 kB │ gzip: 1.39 kB
dist/assets/Waves-Dq94R6kw.js 19.67 kB │ gzip: 6.56 kB
dist/assets/index-DjPXDfmR.js 120.61 kB │ gzip: 47.42 kB
✓ built in 573ms

Validations
@amir20 amir20 mentioned this issue Jan 17, 2025
Open
@sapphi-red sapphi-red transferred this issue from vitejs/vite Jan 18, 2025
@sapphi-red
Copy link
Member

It seems plugin-vue handles the vue specific features after Vite handles the CSS transformation. plugin-vue needs to add a code to suppress these warnings.
A similar warning is output for :slotted and :global.

@sapphi-red sapphi-red added the p3-minor-bug 🔨 An edge case that only affects very specific usage (priority) label Jan 18, 2025
@dflock
Copy link

dflock commented Jan 21, 2025

This also affects me, as I'm using vue, lightningcss and have just upgrqded to vite 6.0.11.

@fl0werpowers
Copy link

fl0werpowers commented Jan 22, 2025 •
edited
Loading

Having the similar warning for :global in my Astro project with Vite 6.0.11 and LightningCSS 1.29.1. Not using Vue, though.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
p3-minor-bug 🔨 An edge case that only affects very specific usage (priority)
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@dflock @amir20 @fl0werpowers @sapphi-red