Release/v1.0.7

README.md

@@ -1 +1,55 @@
+<h1 align="center">ts-css-modules-vite-plugin ⚡ Welcome 😀</h1>
+
+<p align="left">
+  <a href="https://github.com/actions/setup-node"><img alt="GitHub Actions status" src="https://github.com/activeguild/ts-css-modules-vite-plugin/workflows/automatic%20release/badge.svg" style="max-width:100%;"></a>
+</p>
+
 # ts-css-modules-vite-plugin
+
+Read the definition of `vite.config.ts` and resolve the `CSS Modules` type.
+Supports `sass`.
+
+## Install
+
+```bash
+npm i -D ts-css-modules-vite-plugin
+```
+
+## Add it to the `tsconfig.json`
+
+```json
+{
+  "compilerOptions": {
+    ...
+    "plugins": [{"name": "ts-css-modules-vite-plugin"}]
+  },
+}
+```
+
+## Resolve the `vite.config.ts`
+
+Resolve the `preprocessorOptions` setting within the plugin.
+
+```ts
+import path from "path";
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  css: {
+    preprocessorOptions: {
+      scss: {
+        additionalData: `@use "@/styles" as common;`,
+        importer(...args) {
+          if (args[0] !== "@/styles") {
+            return;
+          }
+
+          return {
+            file: `${path.resolve(__dirname, "./src/assets/styles")}`,
+          };
+        },
+      },
+    },
+  },
+});
+```

example/src/App.tsx

@@ -18,7 +18,7 @@ export const App: VFC<Props> = (props) => {
         commonStyles.hoge
       )}
     >
-      vite-plugin-sass-dts-example
+      ts-css-modules-vite-plugin-example
     </header>
   );
 };

package.json

@@ -1,7 +1,7 @@
 {
   "name": "ts-css-modules-vite-plugin",
   "version": "1.0.6",
-  "description": "",
+  "description": "Read the definition of'vite.config.ts' and resolve the CSS Modules type.",
   "main": "dist/index.js",
   "scripts": {
     "build": "tsc --project tsconfig.json",
@@ -15,7 +15,7 @@
     "type": "git",
     "url": "git+https://github.com/activeguild/ts-css-modules-vite-plugin.git"
   },
-  "author": "",
+  "author": "j1ngzoue",
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/activeguild/ts-css-modules-vite-plugin/issues"
@@ -40,5 +40,11 @@
     "postcss-js": "^3.0.3",
     "sass": "^1.43.4",
     "ts-node": "^10.4.0"
+  },
+    "lint-staged": {
+    "*.{js,ts,jsx,tsx}": [
+      "eslint . --fix",
+      "prettier . --write"
+    ]
   }
 }

src/css.ts

@@ -3,19 +3,12 @@ import type { ResolvedConfig } from "vite";
 import { getPreprocessorOptions } from "./options";
 import { AdditionalData, Log } from "./type";
 
-const SPLIT_STR = `/* vite-plugin-sass-dts */\n`;
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-let loadedSassPreprocessor: any;
-
 export const parseCss = (
   log: Log,
   file: string,
   fileName: string,
   config: ResolvedConfig
 ): string => {
-  // const sass = loadSassPreprocessor(config);
-
   const options = getPreprocessorOptions(config);
   const resolveFn = config.createResolver({
     extensions: [".scss", ".sass", ".css"],
@@ -73,27 +66,9 @@ const getData = (
   filename: string,
   additionalData?: AdditionalData
 ): string => {
-  if (!additionalData) return `\n${SPLIT_STR}${data}`;
+  if (!additionalData) return `\n${data}`;
   if (typeof additionalData === "function") {
-    return additionalData(`\n${SPLIT_STR}${data}`, filename);
+    return additionalData(`\n${data}`, filename);
   }
-  return `${additionalData}\n${SPLIT_STR}${data}`;
+  return `${additionalData}\n${data}`;
 };
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-// const loadSassPreprocessor = (config: ResolvedConfig): any => {
-//   try {
-//     if (loadedSassPreprocessor) {
-//       return loadedSassPreprocessor;
-//     }
-//     const fallbackPaths = require.resolve.paths?.("sass") || [];
-//     const resolved = require.resolve("sass", {
-//       paths: [config.root, ...fallbackPaths],
-//     });
-//     return (loadedSassPreprocessor = require(resolved));
-//   } catch (e) {
-//     throw new Error(
-//       `Preprocessor dependency 'sass' not found. Did you install it?`
-//     );
-//   }
-// };