esm-styles 0.4.2 → 0.4.4

package/dist/lib/build.js

@@ -39,6 +39,33 @@ function createAliasPlugin(aliases, sourcePath) {
 function escapeRegex(str) {
     return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
 }
+/**
+ * Write a file atomically, skipping the write when the on-disk content already
+ * matches. Reads the current file first; if it is identical there is no write,
+ * no temp file, and no inode swap, so file watchers (Vite, Cursor) stay quiet
+ * and no needless HMR reload is triggered.
+ *
+ * When the content differs (or the file is missing) it writes to a temp file in
+ * the same directory and renames it over the target. rename() is atomic on the
+ * same filesystem and swaps the inode, so watchers pick up a single clean
+ * replacement instead of observing a truncate-then-write mid-flight.
+ *
+ * Returns true if the file was written, false if it was unchanged and skipped.
+ */
+async function writeAtomic(filePath, data, encoding = 'utf8') {
+    try {
+        const existing = await fs.readFile(filePath, encoding);
+        if (existing === data)
+            return false;
+    }
+    catch {
+        // File does not exist (or is unreadable) -> fall through and write it.
+    }
+    const tmpPath = `${filePath}.tmp`;
+    await fs.writeFile(tmpPath, data, encoding);
+    await fs.rename(tmpPath, filePath);
+    return true;
+}
 /**
  * Import a module with alias resolution using esbuild.
  * Falls back to direct import when no aliases are configured.
@@ -93,6 +120,9 @@ export async function build(configPath = 'esm-styles.config.js') {
     // Ensure output directory exists
     await fs.mkdir(outputPath, { recursive: true });
     const cssFiles = [];
+    // Track whether any output file actually changed on disk. Used to decide
+    // whether the timestamp (an HMR trigger) needs to be bumped at the end.
+    let changed = false;
     // 2. Process globalVariables
     if (config.globalVariables) {
         const inputFile = path.join(sourcePath, `${config.globalVariables}${suffix}`);
@@ -103,7 +133,7 @@ export async function build(configPath = 'esm-styles.config.js') {
         const rootSelector = config.globalRootSelector || ':root';
         const comment = generateCssComment(config.globalVariables);
         const wrappedCss = `${comment}${rootSelector} {\n${cssVars}\n}`;
-        await fs.writeFile(outputFile, wrappedCss, 'utf8');
+        changed = (await writeAtomic(outputFile, wrappedCss)) || changed;
         cssFiles.push({ type: 'global', file: 'global.css' });
     }
     // 3. Process media variable sets
@@ -141,7 +171,7 @@ export async function build(configPath = 'esm-styles.config.js') {
                     }
                     const comment = generateCssComment(setName);
                     const block = `${comment}${fullSelector} {\n${cssVars}\n}`;
-                    await fs.writeFile(outputFile, block, 'utf8');
+                    changed = (await writeAtomic(outputFile, block)) || changed;
                     cssFiles.push({
                         type: 'media',
                         file: fileName,
@@ -226,7 +256,7 @@ export async function build(configPath = 'esm-styles.config.js') {
             const supportingModuleObj = buildSupportingModule([], true);
             const supportingModulePath = path.join(sourcePath, `$${mediaType}.mjs`);
             const moduleContent = `export default ${JSON.stringify(supportingModuleObj, null, 2)}\n`;
-            await fs.writeFile(supportingModulePath, moduleContent, 'utf8');
+            changed = (await writeAtomic(supportingModulePath, moduleContent)) || changed;
         }
     }
     // 4. Process each floor (replaces legacy layers)
@@ -270,7 +300,7 @@ export async function build(configPath = 'esm-styles.config.js') {
             });
             wrappedCss = result.code;
         }
-        await fs.writeFile(outputFile, wrappedCss, 'utf8');
+        changed = (await writeAtomic(outputFile, wrappedCss)) || changed;
         // Calculate relative path from default output directory for imports
         const relativePath = floorOutputPath
             ? path.relative(outputPath, outputFile)
@@ -319,17 +349,16 @@ export async function build(configPath = 'esm-styles.config.js') {
             .filter(Boolean)
             .join('\n') +
         '\n';
-    await fs.writeFile(mainCssPath, mainCss, 'utf8');
-    // 6. Create timestamp file
-    const { outputPath: timestampOutputPath, extension: timestampExtension } = config.timestamp || { outputPath: '', extension: 'mjs' };
-    const timestampPath = path.join(config.basePath || '.', timestampOutputPath, 'timestamp.' + timestampExtension);
-    // Write atomically: write to a temp file in the same directory, then rename
-    // over the target. rename() is atomic on the same filesystem and swaps the
-    // inode, so file watchers (Vite, Cursor) reliably pick up the change instead
-    // of observing a truncate-then-write mid-flight.
-    const timestampTmpPath = `${timestampPath}.tmp`;
-    await fs.writeFile(timestampTmpPath, `export default ${Date.now()}`, 'utf8');
-    await fs.rename(timestampTmpPath, timestampPath);
+    changed = (await writeAtomic(mainCssPath, mainCss)) || changed;
+    // 6. Create timestamp file.
+    // The timestamp embeds Date.now() and is the HMR trigger, so only bump it
+    // when at least one output actually changed. A no-op rebuild leaves every
+    // file (including the timestamp) untouched and triggers no reload.
+    if (changed) {
+        const { outputPath: timestampOutputPath, extension: timestampExtension } = config.timestamp || { outputPath: '', extension: 'mjs' };
+        const timestampPath = path.join(config.basePath || '.', timestampOutputPath, 'timestamp.' + timestampExtension);
+        await writeAtomic(timestampPath, `export default ${Date.now()}`);
+    }
 }
 // Helper for file URL import
 import { pathToFileURL as pathToFileUrl } from 'node:url';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "esm-styles",
-  "version": "0.4.2",
+  "version": "0.4.4",
   "description": "A library for working with ESM styles",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",