Merge pull request #103 from /issues/100

Fix bugs

Author: activeguild

example/react-sass/src/App.module.scss

@@ -20,3 +20,9 @@ $green: #00c851;
 .test {
   @apply px-1.5;
 }
+
+@supports (--num: 1.5) {
+  .myclass {
+    display: block;
+  }
+}

example/react-sass/src/App.module.scss.d.ts

@@ -5,5 +5,6 @@ declare const classNames: typeof globalClassNames & {
   readonly active: 'active'
   readonly input: 'input'
   readonly test: 'test'
+  readonly myclass: 'myclass'
 }
 export default classNames

example/react-sass/src/App.tsx

@@ -2,6 +2,7 @@ import { FC } from 'react'
 import styles from './App.module.scss'
 import { classNamesFunc } from 'classnames-generics'
 import { User } from './User/User'
+import styles2 from './exclude/Exclude.module.scss'
 
 const classNames = classNamesFunc<keyof typeof styles>()
 type Props = {

example/react-sass/src/exclude/Exclude.module.scss

@@ -0,0 +1,5 @@
+.exclude {
+  &.active {
+    background-color: red;
+  }
+}

example/react-sass/vite.config.ts

@@ -42,6 +42,7 @@ export default defineConfig({
         outputFilePath: path.resolve(__dirname, './src/@types/style.d.ts'),
       },
       prettierFilePath: path.resolve('../../.prettierrc.cjs'),
+      excludePath: ['./src/exclude/*'],
       esmExport: true,
       // typeName: {
       //   replacement: (fileName) => {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-sass-dts",
-  "version": "1.3.24",
+  "version": "1.3.25",
   "engines": {
     "node": ">=20"
   },

src/extract.ts

@@ -3,6 +3,7 @@ import type { CSSJSObj, GetParseCaseFunction } from './type'
 
 // [Note]: @apply for Tailwind
 const importRe = new RegExp(/^(@import|@apply)/)
+const supportRe = new RegExp(/^(@support)/)
 const keySeparatorRe = new RegExp(/(?=[\s.:[\]><+,()])/g)
 
 export const extractClassNameKeys = (
@@ -12,14 +13,18 @@ export const extractClassNameKeys = (
 ): Map<string, boolean> => {
   return Object.entries(obj).reduce<Map<string, boolean>>(
     (curr, [key, value]) => {
+      console.log(key, value)
       if (importRe.test(key)) return curr
       const splitKeys = key.split(keySeparatorRe)
-      for (const splitKey of splitKeys) {
-        if (parentKey === ':export' || splitKey.startsWith('.')) {
-          if (toParseCase) {
-            curr.set(toParseCase(splitKey.replace('.', '').trim()), true)
-          } else {
-            curr.set(splitKey.replace('.', '').trim(), true)
+
+      if (!supportRe.test(key)) {
+        for (const splitKey of splitKeys) {
+          if (parentKey === ':export' || splitKey.startsWith('.')) {
+            if (toParseCase) {
+              curr.set(toParseCase(splitKey.replace('.', '').trim()), true)
+            } else {
+              curr.set(splitKey.replace('.', '').trim(), true)
+            }
           }
         }
       }

src/index.ts

@@ -1,17 +1,19 @@
 import prettier from 'prettier'
 const { resolveConfig } = prettier
 
-import type { Plugin as VitePlugin } from 'vite'
+import { Plugin as VitePlugin, createFilter } from 'vite'
 import { main } from './main'
 import type { FinalConfig, PluginOptions } from './type'
 import { isCSSModuleRequest } from './util'
 
 export default function Plugin(option: PluginOptions = {}): VitePlugin {
   let cacheConfig: FinalConfig
+  let filter: ReturnType<typeof createFilter>
   const enabledMode = option.enabledMode || ['development']
   return {
     name: 'vite-plugin-sass-dts',
     async configResolved(config) {
+      filter = createFilter(undefined, option.excludePath)
       const prettierOptions =
         (await resolveConfig(option.prettierFilePath || config.root)) || {}
       cacheConfig = {
@@ -20,15 +22,16 @@ export default function Plugin(option: PluginOptions = {}): VitePlugin {
       }
     },
     handleHotUpdate(context) {
-      if (!isCSSModuleRequest(context.file)) return
+      if (!isCSSModuleRequest(context.file) || !filter(context.file)) return
       main(context.file, cacheConfig, option)
       return
     },
     transform(code, id) {
       const fileName = id.replace(/(?:\?|&)(used|direct|inline|vue).*/, '')
       if (
         !enabledMode.includes(cacheConfig.env.MODE) ||
-        !isCSSModuleRequest(fileName)
+        !isCSSModuleRequest(fileName) ||
+        !filter(id)
       ) {
         // returning undefined will signal vite that the file has not been transformed
         // avoiding warnings about source maps not being generated
@@ -40,7 +43,7 @@ export default function Plugin(option: PluginOptions = {}): VitePlugin {
       )
     },
     watchChange(id) {
-      if (isCSSModuleRequest(id)) {
+      if (isCSSModuleRequest(id) && filter(id)) {
         this.addWatchFile(id)
       }
     },

src/type.ts

@@ -14,6 +14,7 @@ export type PluginOptions = {
   esmExport?: boolean
   outputDir?: string
   sourceDir?: string
+  excludePath?: string | RegExp | Array<string | RegExp>
   prettierFilePath?: string
 }