@nooeh/cli 0.2.5 → 0.2.6

package/dist/add.js

@@ -1,5 +1,5 @@
 import { mkdir, readFile, writeFile } from "node:fs/promises";
-import { dirname, isAbsolute, join, relative, resolve } from "node:path";
+import { dirname, isAbsolute, join, relative, resolve, sep } from "node:path";
 import { createInterface } from "node:readline/promises";
 import { defaultConfig, hasConfig, readConfig, resolveConfigAlias } from "./config.js";
 import { installDependencies } from "./dependencies.js";
@@ -49,8 +49,11 @@ function resolveTargetPath(uiDirectory, filePath) {
     }
     return targetPath;
 }
-function replaceTokenImport(source, stylesAlias) {
-    return source.replaceAll("@nooeh/tokens/semantic.stylex", `${stylesAlias}/semantic.stylex`);
+function replaceTokenImport(source, targetPath, stylesDirectory) {
+    const tokenPath = join(stylesDirectory, "semantic.stylex");
+    const importPath = relative(dirname(targetPath), tokenPath).split(sep).join("/");
+    const relativeImportPath = importPath.startsWith(".") ? importPath : `./${importPath}`;
+    return source.replaceAll("@nooeh/tokens/semantic.stylex", relativeImportPath);
 }
 export async function add(projectDirectory, componentName, options = {}) {
     if (!componentName)
@@ -65,6 +68,7 @@ export async function add(projectDirectory, componentName, options = {}) {
     const config = options["dry-run"] && shouldInitialize ? defaultConfig : await readConfig(projectDirectory);
     const resolved = await resolveComponent(componentName);
     const uiDirectory = await resolveConfigAlias(projectDirectory, config.aliases.ui, "aliases.ui");
+    const stylesDirectory = await resolveConfigAlias(projectDirectory, config.aliases.styles, "aliases.styles");
     let isOverwriteConfirmed = false;
     async function confirmOverwrite() {
         if (isOverwriteConfirmed)
@@ -78,7 +82,7 @@ export async function add(projectDirectory, componentName, options = {}) {
             console.log(`Will add: ${targetPath}`);
             continue;
         }
-        await writeSource(replaceTokenImport(file.content, config.aliases.styles), targetPath, confirmOverwrite);
+        await writeSource(replaceTokenImport(file.content, targetPath, stylesDirectory), targetPath, confirmOverwrite);
     }
     const shouldInstallDependencies = resolved.externalDependencies.length > 0 &&
         !options.skipDependencyInstall &&

package/dist/init.js

@@ -1,5 +1,5 @@
 import { access, mkdir, readFile, writeFile } from "node:fs/promises";
-import { join, relative, sep } from "node:path";
+import { join, relative } from "node:path";
 import { createInterface } from "node:readline/promises";
 import { configFileName, defaultConfig, hasConfig, resolveConfigAlias, writeConfig, } from "./config.js";
 import { installDependencies } from "./dependencies.js";
@@ -33,40 +33,31 @@ async function readViteConfig(projectDirectory) {
     }
     throw new Error("Could not find a Vite config file.");
 }
-function getStylexPlugin(stylesAlias, tokenDirectory, projectDirectory) {
-    const tokenPath = relative(projectDirectory, tokenDirectory).split(sep).join("/");
-    const aliasPattern = `${stylesAlias}/*`;
-    const aliasTarget = `/ROOT/${tokenPath}/*`;
-    return `stylex.vite({
-    aliases: { ${JSON.stringify(aliasPattern)}: [${JSON.stringify(aliasTarget)}] },
-    unstable_moduleResolution: {
-      type: "commonJS",
-      rootDir: new URL(".", import.meta.url).pathname,
-    },
-  })`;
-}
-function configureVite(source, stylesAlias, tokenDirectory, projectDirectory) {
+function configureVite(source) {
     const importLine = 'import stylex from "@stylexjs/unplugin";';
     const pluginPattern = /plugins:\s*\[([^\]]*)\]/s;
-    const configPattern = /defineConfig\(\{\s*/;
-    const stylexPlugin = getStylexPlugin(stylesAlias, tokenDirectory, projectDirectory);
+    const stylexPlugin = "stylex.vite()";
     const legacyStylexPluginPattern = /stylex\.vite\(\{\s*useCSSLayers:\s*true\s*\}\)/;
     const emptyStylexPluginPattern = /stylex\.vite\(\)/;
+    const nooehStylexPluginPattern = /stylex\.vite\(\{\s*(?:\/\/[^\n]*\s*)?(?:useCSSLayers:\s*true,?\s*)?aliases:\s*\{[^}]*\},\s*unstable_moduleResolution:\s*\{\s*type:\s*["']commonJS["'],\s*rootDir:\s*new URL\(["']\.["'],\s*import\.meta\.url\)\.pathname,?\s*\},\s*\}\)/s;
     if (!source.includes("stylex.vite(") && !pluginPattern.test(source)) {
         throw new Error("Could not safely update the Vite plugins array. Add stylex.vite() manually.");
     }
-    let withStylex = source;
+    if (nooehStylexPluginPattern.test(source)) {
+        return source.replace(nooehStylexPluginPattern, stylexPlugin);
+    }
     if (source.includes("unstable_moduleResolution")) {
-        withStylex = source.replace(/\s*useCSSLayers:\s*true,?/, "");
+        throw new Error("Could not safely simplify the existing StyleX plugin. Remove Nooeh's aliases and unstable_moduleResolution manually, then use stylex.vite().");
     }
-    else if (legacyStylexPluginPattern.test(source)) {
+    let withStylex = source;
+    if (legacyStylexPluginPattern.test(source)) {
         withStylex = source.replace(legacyStylexPluginPattern, stylexPlugin);
     }
     else if (emptyStylexPluginPattern.test(source)) {
         withStylex = source.replace(emptyStylexPluginPattern, stylexPlugin);
     }
     else if (source.includes("stylex.vite(")) {
-        throw new Error("Could not safely update the existing StyleX plugin. Add Nooeh's aliases and unstable_moduleResolution manually.");
+        throw new Error("Could not safely update the existing StyleX plugin. Configure stylex.vite() manually.");
     }
     else {
         withStylex = (source.includes(importLine) ? source : `${importLine}\n${source}`).replace(pluginPattern, (_, plugins) => {
@@ -74,16 +65,11 @@ function configureVite(source, stylesAlias, tokenDirectory, projectDirectory) {
             return `plugins: [${prefix}]`;
         });
     }
-    if (withStylex.includes("alias:"))
-        return withStylex;
-    if (!configPattern.test(withStylex)) {
-        throw new Error('Could not safely add the "@" Vite alias. Add resolve.alias["@"] manually.');
-    }
-    return withStylex.replace(configPattern, 'defineConfig({\n  resolve: { alias: { "@": new URL("./src", import.meta.url).pathname } },\n  ');
+    return withStylex;
 }
-async function writeViteFiles(projectDirectory, tokenDirectory, stylesAlias, refreshLegacyTokens) {
+async function writeViteFiles(projectDirectory, tokenDirectory, refreshLegacyTokens) {
     const { path: configPath, source: configSource } = await readViteConfig(projectDirectory);
-    const configuredVite = configureVite(configSource, stylesAlias, tokenDirectory, projectDirectory);
+    const configuredVite = configureVite(configSource);
     await writeNooehFiles(projectDirectory, tokenDirectory, refreshLegacyTokens);
     await writeFile(configPath, configuredVite, "utf8");
     console.log(`Configured Vite and created ${relative(projectDirectory, tokenDirectory)}.`);
@@ -143,7 +129,7 @@ export async function init(projectDirectory, options) {
             }
         }
         if (options.framework === "vite") {
-            await writeViteFiles(projectDirectory, tokenDirectory, stylesAlias, Boolean(options.force));
+            await writeViteFiles(projectDirectory, tokenDirectory, Boolean(options.force));
         }
         else {
             await writeNooehFiles(projectDirectory, tokenDirectory, Boolean(options.force));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nooeh/cli",
-  "version": "0.2.5",
+  "version": "0.2.6",
   "private": false,
   "bin": {
     "nooeh": "./dist/cli.js"