vueless 1.1.1-beta.49 → 1.1.1-beta.50

package/bin/commands/init.js

@@ -12,6 +12,7 @@ import { DEFAULT_VUELESS_CONFIG_CONTENT } from "../constants.js";
 import {
   JAVASCRIPT_EXT,
   TYPESCRIPT_EXT,
+  VUELESS_CONFIG_DIR,
   CONFIG_INDEX_FILE_NAME,
   VUELESS_CONFIG_FILE_NAME,
 } from "../../constants.js";
@@ -19,7 +20,7 @@ import {
 const vuelessInitOptions = ["--ts", "--js"];
 
 /**
- * Initializes Vueless in the project by creating a default config file and .vueless directory.
+ * Initializes Vueless in the project by creating a default config file and vueless config directory.
  * @param {string[]} options - The function options.
  * @param {boolean} options.includes("--ts") - If true, creates a TypeScript config file.
  * @param {boolean} options.includes("--js") - If true, creates a JavaScript config file.
@@ -68,14 +69,17 @@ export async function vuelessInit(options) {
     ),
   );
 
-  /* Create .vueless directory and index file. */
-  const vuelessDir = path.join(cwd(), ".vueless");
+  /* Create a vueless config directory and index file. */
+  const vuelessDir = path.join(cwd(), VUELESS_CONFIG_DIR);
   const destPath = path.join(vuelessDir, `${CONFIG_INDEX_FILE_NAME}${fileExt}`);
 
   if (!existsSync(vuelessDir)) {
     mkdirSync(vuelessDir);
     console.log(
-      styleText("green", "The '.vueless' directory was created in the project root directory."),
+      styleText(
+        "green",
+        `The '${VUELESS_CONFIG_DIR}' directory was created in the project root directory.`,
+      ),
     );
   }
 

package/constants.d.ts

@@ -319,6 +319,7 @@ export const VUELESS_CONFIGS_CACHED_DIR: "node_modules/.cache/vueless/configs";
 export const VUELESS_MERGED_CONFIGS_CACHED_DIR: "node_modules/.cache/vueless/mergedConfigs";
 export const VUELESS_CONFIG_FILE_NAME: "vueless.config";
 export const CONFIG_INDEX_FILE_NAME: "index";
+export const VUELESS_CONFIG_DIR: ".vueless";
 export const DEFAULT_EXIT_CODE: 0;
 export const FAILURE_CODE: 1;
 export const PX_IN_REM: 16;

package/constants.js

@@ -403,6 +403,7 @@ export const VUELESS_CONFIGS_CACHED_DIR = `${VUELESS_CACHE_DIR}/configs`;
 export const VUELESS_MERGED_CONFIGS_CACHED_DIR = `${VUELESS_CACHE_DIR}/mergedConfigs`;
 export const VUELESS_CONFIG_FILE_NAME = "vueless.config";
 export const CONFIG_INDEX_FILE_NAME = "index";
+export const VUELESS_CONFIG_DIR = ".vueless";
 
 /* System error codes */
 export const DEFAULT_EXIT_CODE = 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "1.1.1-beta.49",
+  "version": "1.1.1-beta.50",
   "description": "Vue Styleless UI Component Library, powered by Tailwind CSS.",
   "author": "Johnny Grid <hello@vueless.com> (https://vueless.com)",
   "homepage": "https://vueless.com",

package/plugin-vite.js

@@ -122,14 +122,13 @@ export const Vueless = function (options = {}) {
 
     configResolved: async () => {
       if (!isNuxtModuleEnv) {
+        /* auto import user configs */
+        await autoImportUserConfigs();
+
         /* merge and cache component configs. */
         await cacheMergedConfigs(vuelessSrcDir);
       }
 
-      if (!isInternalEnv && !isNuxtModuleEnv) {
-        await autoImportUserConfigs();
-      }
-
       await buildWebTypes(vuelessSrcDir);
       await setCustomPropTypes(vuelessSrcDir);
 

package/utils/node/helper.js

@@ -12,10 +12,12 @@ import {
   JAVASCRIPT_EXT,
   TYPESCRIPT_EXT,
   SUPPRESS_TS_CHECK,
+  VUELESS_CONFIG_DIR,
   COMPONENTS_INDEX_EXPORT,
   COMPONENTS_INDEX_COMMENT,
   VUELESS_CONFIGS_CACHED_DIR,
   VUELESS_MERGED_CONFIGS_CACHED_DIR,
+  CONFIG_INDEX_FILE_NAME,
 } from "../../constants.js";
 
 export async function getDirFiles(dirPath, ext, { recursive = true, exclude = [] } = {}) {
@@ -85,7 +87,7 @@ export function getVueDirs() {
 }
 
 export function getVuelessConfigDirs() {
-  return [path.join(cwd(), ".vueless")];
+  return [path.join(cwd(), VUELESS_CONFIG_DIR)];
 }
 
 export async function getMergedComponentConfig(name) {
@@ -184,10 +186,10 @@ export async function detectTypeScript() {
 }
 
 export async function autoImportUserConfigs(rootDir = "") {
-  const vuelessConfigDir = path.join(cwd(), rootDir, ".vueless");
+  const vuelessConfigDir = path.join(cwd(), rootDir, VUELESS_CONFIG_DIR);
 
-  const indexTsPath = path.join(vuelessConfigDir, "index.ts");
-  const indexJsPath = path.join(vuelessConfigDir, "index.js");
+  const indexTsPath = path.join(vuelessConfigDir, `${CONFIG_INDEX_FILE_NAME}${TYPESCRIPT_EXT}`);
+  const indexJsPath = path.join(vuelessConfigDir, `${CONFIG_INDEX_FILE_NAME}${JAVASCRIPT_EXT}`);
 
   const hasTypeScript = detectTypeScript();
 
@@ -196,13 +198,16 @@ export async function autoImportUserConfigs(rootDir = "") {
 
   const configFiles = await getDirFiles(vuelessConfigDir, fileExt, {
     recursive: true,
-    exclude: ["index.ts", "index.js"],
+    exclude: [
+      `${CONFIG_INDEX_FILE_NAME}${TYPESCRIPT_EXT}`,
+      `${CONFIG_INDEX_FILE_NAME}${JAVASCRIPT_EXT}`,
+    ],
   });
 
   const componentConfigFiles = configFiles.filter((filePath) => {
     const fileName = path.basename(filePath);
 
-    return /^U\w+\.config\.(ts|js)$/.test(fileName);
+    return /^U\w+\.(ts|js)$/.test(fileName);
   });
 
   const imports = [];
@@ -211,12 +216,11 @@ export async function autoImportUserConfigs(rootDir = "") {
   if (componentConfigFiles.length) {
     for (const configFilePath of componentConfigFiles) {
       const fileName = path.basename(configFilePath, path.extname(configFilePath));
-      const componentName = fileName.replace(".config", "");
       const relativePath = path.relative(vuelessConfigDir, configFilePath);
       const importPath = "./" + relativePath.replace(/\\/g, "/");
 
-      imports.push(`import ${componentName} from "${importPath}";`);
-      componentEntries.push(`  ${componentName},`);
+      imports.push(`import ${fileName} from "${importPath}";`);
+      componentEntries.push(`  ${fileName},`);
     }
   }
 

package/utils/node/storybook.js

@@ -1,4 +1,5 @@
 import { getVuelessConfig } from "./vuelessConfig.js";
+import { autoImportUserConfigs } from "./helper.js";
 import {
   COMPONENTS,
   DIRECTIVES,
@@ -27,6 +28,9 @@ export function defineConfigWithVueless(config) {
  * @return {Promise<string[]>} A promise that resolves to an array of glob patterns for Vueless stories.
  */
 export async function getVuelessStoriesGlob(vuelessEnv) {
+  /* Auto import user configs. */
+  await autoImportUserConfigs();
+
   const vuelessSrcDir = vuelessEnv === INTERNAL_ENV ? VUELESS_LOCAL_DIR : VUELESS_PACKAGE_DIR;
   const vuelessConfig = await getVuelessConfig();
   const storiesGlob = [];