@parcel/transformer-stylus 2.0.0-nightly.149 → 2.0.0-nightly.1491

package/lib/StylusTransformer.js

@@ -4,78 +4,168 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
-var _plugin = require("@parcel/plugin");
-
-var _utils = require("@parcel/utils");
-
-var _path = _interopRequireDefault(require("path"));
-
+function _plugin() {
+  const data = require("@parcel/plugin");
+  _plugin = function () {
+    return data;
+  };
+  return data;
+}
+function _utils() {
+  const data = require("@parcel/utils");
+  _utils = function () {
+    return data;
+  };
+  return data;
+}
+function _path() {
+  const data = _interopRequireDefault(require("path"));
+  _path = function () {
+    return data;
+  };
+  return data;
+}
+function _fs() {
+  const data = _interopRequireDefault(require("fs"));
+  _fs = function () {
+    return data;
+  };
+  return data;
+}
+function _stylus() {
+  const data = _interopRequireDefault(require("stylus"));
+  _stylus = function () {
+    return data;
+  };
+  return data;
+}
+function _parser() {
+  const data = _interopRequireDefault(require("stylus/lib/parser"));
+  _parser = function () {
+    return data;
+  };
+  return data;
+}
+function _depsResolver() {
+  const data = _interopRequireDefault(require("stylus/lib/visitor/deps-resolver"));
+  _depsResolver = function () {
+    return data;
+  };
+  return data;
+}
+function _nodes() {
+  const data = _interopRequireDefault(require("stylus/lib/nodes"));
+  _nodes = function () {
+    return data;
+  };
+  return data;
+}
+function _utils2() {
+  const data = _interopRequireDefault(require("stylus/lib/utils"));
+  _utils2 = function () {
+    return data;
+  };
+  return data;
+}
+function _evaluator() {
+  const data = _interopRequireDefault(require("stylus/lib/visitor/evaluator"));
+  _evaluator = function () {
+    return data;
+  };
+  return data;
+}
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 const URL_RE = /^(?:url\s*\(\s*)?['"]?(?:[#/]|(?:https?:)?\/\/)/i;
-
-var _default = new _plugin.Transformer({
-  getConfig({
-    asset
+var _default = exports.default = new (_plugin().Transformer)({
+  async loadConfig({
+    config
   }) {
-    return asset.getConfig(['.stylusrc', '.stylusrc.js'], {
+    let configFile = await config.getConfig(['.stylusrc', '.stylusrc.js', '.stylusrc.cjs', '.stylusrc.mjs'], {
       packageKey: 'stylus'
     });
+    if (configFile) {
+      // Resolve relative paths from config file
+      if (configFile.contents.paths) {
+        configFile.contents.paths = configFile.contents.paths.map(p => _path().default.resolve(_path().default.dirname(configFile.filePath), p));
+      }
+      return configFile.contents;
+    }
   },
-
   async transform({
     asset,
     resolve,
     config,
     options
   }) {
-    // stylus should be installed locally in the module that's being required
-    let stylus = await options.packageManager.require('stylus', asset.filePath);
+    let stylusConfig = config !== null && config !== void 0 ? config : {};
     let code = await asset.getCode();
-    let style = stylus(code, config);
+    let style = (0, _stylus().default)(code, {
+      ...stylusConfig
+    });
     style.set('filename', asset.filePath);
-    style.set('include css', true); // Setup a handler for the URL function so we add dependencies for linked assets.
-
+    style.set('include css', true);
+    // Setup a handler for the URL function so we add dependencies for linked assets.
     style.define('url', node => {
-      let filename = asset.addURLDependency(node.val, node.filename);
-      return new stylus.nodes.Literal(`url(${JSON.stringify(filename)})`);
+      let filename = asset.addURLDependency(node.val, {
+        loc: (0, _utils().createDependencyLocation)({
+          line: node.lineno,
+          column: node.column
+        }, node.val)
+      });
+      return new (_stylus().default.nodes.Literal)(`url(${JSON.stringify(filename)})`);
     });
-    style.set('Evaluator', (await createEvaluator(code, asset, resolve, style.options, options)));
+    let {
+      resolved: stylusPath
+    } = await options.packageManager.resolve('stylus', __filename);
+    let nativeGlob = await options.packageManager.require('glob', stylusPath);
+    style.set('Evaluator', await createEvaluator(code, asset, resolve, style.options, options, nativeGlob));
     asset.type = 'css';
     asset.setCode(style.render());
     asset.meta.hasDependencies = false;
     return [asset];
   }
-
 });
-
-exports.default = _default;
-
-async function getDependencies(code, filepath, asset, resolve, options, parcelOptions, seen = new Set()) {
+function attemptResolve(importedPath, filepath, asset, resolve, deps) {
+  if (deps.has(importedPath)) {
+    return;
+  }
+  if ((0, _utils().isGlob)(importedPath)) {
+    // Invalidate when new files are created that match the glob pattern.
+    let absoluteGlob = _path().default.resolve(_path().default.dirname(filepath), importedPath);
+    asset.invalidateOnFileCreate({
+      glob: absoluteGlob
+    });
+    deps.set(importedPath, (0, _utils().glob)(absoluteGlob, asset.fs, {
+      onlyFiles: true
+    }).then(entries => Promise.all(entries.map(entry => resolve(filepath, './' + _path().default.relative(_path().default.dirname(filepath), entry), {
+      packageConditions: ['stylus', 'style']
+    })))));
+  } else {
+    deps.set(importedPath, resolve(filepath, importedPath, {
+      packageConditions: ['stylus', 'style']
+    }));
+  }
+}
+async function getDependencies(code, filepath, asset, resolve, options, parcelOptions, nativeGlob, seen = new Set(), includeImports = true) {
   seen.add(filepath);
-  const [Parser, DepsResolver, nodes, utils] = await Promise.all(['parser', 'visitor/deps-resolver', 'nodes', 'utils'].map(dep => parcelOptions.packageManager.require('stylus/lib/' + dep, filepath)));
-  nodes.filename = asset.filePath;
-  let parser = new Parser(code, options);
+  _nodes().default.filename = asset.filePath;
+  let parser = new (_parser().default)(code, options);
   let ast = parser.parse();
   let deps = new Map();
-  new class extends DepsResolver {
+  if (includeImports && options.imports) {
+    for (let importedPath of options.imports) {
+      attemptResolve(importedPath, filepath, asset, resolve, deps);
+    }
+  }
+  class ImportVisitor extends _depsResolver().default {
     visitImport(imported) {
       let importedPath = imported.path.first.string;
-
-      if (!deps.has(importedPath)) {
-        if ((0, _utils.isGlob)(importedPath)) {
-          deps.set(importedPath, (0, _utils.glob)(_path.default.resolve(_path.default.dirname(filepath), importedPath), parcelOptions.inputFS, {
-            onlyFiles: true
-          }).then(entries => Promise.all(entries.map(entry => resolve(filepath, './' + _path.default.relative(_path.default.dirname(filepath), entry))))));
-        } else {
-          deps.set(importedPath, resolve(filepath, importedPath));
-        }
-      }
+      attemptResolve(importedPath, filepath, asset, resolve, deps);
     }
+  }
+  new ImportVisitor(ast, options).visit(ast);
 
-  }(ast, options).visit(ast); // Recursively process depdendencies, and return a map with all resolved paths.
-
+  // Recursively process depdendencies, and return a map with all resolved paths.
   let res = new Map();
   await Promise.all(Array.from(deps.entries()).map(async ([importedPath, resolved]) => {
     try {
@@ -83,43 +173,42 @@ async function getDependencies(code, filepath, asset, resolve, options, parcelOp
     } catch (err) {
       resolved = null;
     }
-
     let found;
-
-    if (resolved) {
+    if (resolved && (!Array.isArray(resolved) || resolved.length > 0)) {
       found = Array.isArray(resolved) ? resolved : [resolved];
       res.set(importedPath, resolved);
     } else {
       // If we couldn't resolve, try the normal stylus resolver.
       // We just need to do this to keep track of the dependencies - stylus does the real work.
+
       // support optional .styl
       let originalPath = importedPath;
-
       if (!/\.styl$/i.test(importedPath)) {
         importedPath += '.styl';
       }
 
-      let paths = (options.paths || []).concat(_path.default.dirname(filepath || '.'));
-      found = utils.find(importedPath, paths, filepath);
-
+      // Patch the native FS so we use Parcel's FS, and track files that are
+      // checked so we invalidate the cache when they are created.
+      let restore = patchNativeFS(asset.fs, nativeGlob);
+      let paths = [...new Set((options.paths || []).concat(_path().default.dirname(filepath || '.')))];
+      found = _utils2().default.find(importedPath, paths, filepath);
       if (!found) {
-        found = utils.lookupIndex(originalPath, paths, filepath);
+        found = _utils2().default.lookupIndex(originalPath, paths, filepath);
+      }
+      for (let invalidation of restore()) {
+        asset.invalidateOnFileCreate(invalidation);
       }
-
       if (!found) {
         throw new Error('failed to locate file ' + originalPath);
       }
-    } // Recursively process resolved files as well to get nested deps
-
+    }
 
+    // Recursively process resolved files as well to get nested deps
     for (let resolved of found) {
       if (!seen.has(resolved)) {
-        await asset.addIncludedFile({
-          filePath: resolved
-        });
+        asset.invalidateOnFileChange(resolved);
         let code = await asset.fs.readFile(resolved, 'utf8');
-
-        for (let [path, resolvedPath] of await getDependencies(code, resolved, asset, resolve, options, parcelOptions, seen)) {
+        for (let [path, resolvedPath] of await getDependencies(code, resolved, asset, resolve, options, parcelOptions, nativeGlob, seen, false)) {
           res.set(path, resolvedPath);
         }
       }
@@ -127,23 +216,22 @@ async function getDependencies(code, filepath, asset, resolve, options, parcelOp
   }));
   return res;
 }
+async function createEvaluator(code, asset, resolve, options, parcelOptions, nativeGlob) {
+  const deps = await getDependencies(code, asset.filePath, asset, resolve, options, parcelOptions, nativeGlob);
 
-async function createEvaluator(code, asset, resolve, options, parcelOptions) {
-  const deps = await getDependencies(code, asset.filePath, asset, resolve, options, parcelOptions);
-  const Evaluator = await parcelOptions.packageManager.require('stylus/lib/visitor/evaluator', asset.filePath); // This is a custom stylus evaluator that extends stylus with support for the node
+  // This is a custom stylus evaluator that extends stylus with support for the node
   // require resolution algorithm. It also adds all dependencies to the parcel asset
   // tree so the file watcher works correctly, etc.
-
-  return class extends Evaluator {
+  class CustomEvaluator extends _evaluator().default {
     visitImport(imported) {
       let node = this.visit(imported.path).first;
       let path = node.string;
-
       if (node.name !== 'url' && path && !URL_RE.test(path)) {
-        let resolved = deps.get(path); // First try resolving using the node require resolution algorithm.
+        let resolved = deps.get(path);
+
+        // First try resolving using the node require resolution algorithm.
         // This allows stylus files in node_modules to be resolved properly.
         // If we find something, update the AST so stylus gets the absolute path to load later.
-
         if (resolved) {
           if (!Array.isArray(resolved)) {
             node.string = resolved;
@@ -152,26 +240,85 @@ async function createEvaluator(code, asset, resolve, options, parcelOptions) {
             // replace it with a separate import node for each file
             return mergeBlocks(resolved.map(resolvedPath => {
               node.string = resolvedPath;
-              return super.visitImport(imported.clone());
+              let restore = patchNativeFS(asset.fs, nativeGlob);
+              let res = super.visitImport(imported.clone());
+              restore();
+              return res;
             }));
           }
         }
-      } // Done. Let stylus do its thing.
+      }
 
+      // Patch the native FS so stylus uses Parcel's FS to read the file.
+      let restore = patchNativeFS(asset.fs, nativeGlob);
 
-      return super.visitImport(imported);
+      // Done. Let stylus do its thing.
+      let res = super.visitImport(imported);
+      restore();
+      return res;
     }
+  }
+  return CustomEvaluator;
+}
+function patchNativeFS(fs, nativeGlob) {
+  let invalidations = [];
+  let readFileSync = _fs().default.readFileSync;
+  let statSync = _fs().default.statSync;
+
+  // $FlowFixMe
+  _fs().default.readFileSync = (filename, encoding) => {
+    return fs.readFileSync(filename, encoding);
+  };
+
+  // $FlowFixMe
+  _fs().default.statSync = p => {
+    try {
+      return fs.statSync(p);
+    } catch (err) {
+      // Track files that were checked but don't exist so that we watch for their creation.
+      if (!p.includes(`node_modules${_path().default.sep}stylus`)) {
+        invalidations.push({
+          filePath: p
+        });
+      }
+      throw err;
+    }
+  };
 
+  // Patch the `glob` module as well so we use the Parcel FS and track invalidations.
+  let glob = nativeGlob.sync;
+  nativeGlob.sync = p => {
+    let res = (0, _utils().globSync)(p, fs);
+    if (!p.includes(`node_modules${_path().default.sep}stylus`)) {
+      // Sometimes stylus passes file paths with no glob parts to the `glob` module.
+      // We want to avoid treating these as globs for performance.
+      if ((0, _utils().isGlob)(p)) {
+        invalidations.push({
+          glob: p
+        });
+      } else if (res.length === 0) {
+        invalidations.push({
+          filePath: p
+        });
+      }
+    }
+    return res;
+  };
+  return () => {
+    // $FlowFixMe
+    _fs().default.readFileSync = readFileSync;
+    // $FlowFixMe
+    _fs().default.statSync = statSync;
+    nativeGlob.sync = glob;
+    return invalidations;
   };
 }
+
 /**
  * Puts the content of all given node blocks into the first one, essentially merging them.
  */
-
-
 function mergeBlocks(blocks) {
   let finalBlock;
-
   for (const block of blocks) {
     if (finalBlock) {
       // $FlowFixMe - finalBlock is definitely defined
@@ -180,6 +327,5 @@ function mergeBlocks(blocks) {
       finalBlock = block;
     }
   }
-
   return finalBlock;
 }

package/package.json

@@ -1,10 +1,14 @@
 {
   "name": "@parcel/transformer-stylus",
-  "version": "2.0.0-nightly.149+453f7b0b",
+  "version": "2.0.0-nightly.1491+fdf495ba3",
   "license": "MIT",
   "publishConfig": {
     "access": "public"
   },
+  "funding": {
+    "type": "opencollective",
+    "url": "https://opencollective.com/parcel"
+  },
   "repository": {
     "type": "git",
     "url": "https://github.com/parcel-bundler/parcel.git"
@@ -12,15 +16,13 @@
   "main": "lib/StylusTransformer.js",
   "source": "src/StylusTransformer.js",
   "engines": {
-    "node": ">= 10.0.0",
-    "parcel": "^2.0.0-alpha.1.1"
+    "node": ">= 12.0.0",
+    "parcel": "2.0.0-nightly.1489+fdf495ba3"
   },
   "dependencies": {
-    "@parcel/plugin": "2.0.0-nightly.149+453f7b0b",
-    "@parcel/utils": "2.0.0-nightly.149+453f7b0b"
-  },
-  "devDependencies": {
-    "stylus": "^0.54.5"
+    "@parcel/plugin": "2.0.0-nightly.1491+fdf495ba3",
+    "@parcel/utils": "2.0.0-nightly.1491+fdf495ba3",
+    "stylus": "^0.55.0"
   },
-  "gitHead": "453f7b0bf295e6a7cbec5d24fab4c48e21e6168f"
+  "gitHead": "fdf495ba3c8ed727d10e87cc9697bc9ef5ec997a"
 }

package/src/StylusTransformer.js

@@ -1,34 +1,72 @@
 // @flow
 
 import {Transformer} from '@parcel/plugin';
-import {isGlob, glob} from '@parcel/utils';
+import {createDependencyLocation, isGlob, glob, globSync} from '@parcel/utils';
 import path from 'path';
+import nativeFS from 'fs';
+import stylus from 'stylus';
+import Parser from 'stylus/lib/parser';
+import DepsResolver from 'stylus/lib/visitor/deps-resolver';
+import nodes from 'stylus/lib/nodes';
+import utils from 'stylus/lib/utils';
+import Evaluator from 'stylus/lib/visitor/evaluator';
 
 const URL_RE = /^(?:url\s*\(\s*)?['"]?(?:[#/]|(?:https?:)?\/\/)/i;
 
-export default new Transformer({
-  getConfig({asset}) {
-    return asset.getConfig(['.stylusrc', '.stylusrc.js'], {
-      packageKey: 'stylus',
-    });
+export default (new Transformer({
+  async loadConfig({config}) {
+    let configFile = await config.getConfig(
+      ['.stylusrc', '.stylusrc.js', '.stylusrc.cjs', '.stylusrc.mjs'],
+      {
+        packageKey: 'stylus',
+      },
+    );
+
+    if (configFile) {
+      // Resolve relative paths from config file
+      if (configFile.contents.paths) {
+        configFile.contents.paths = configFile.contents.paths.map(p =>
+          path.resolve(path.dirname(configFile.filePath), p),
+        );
+      }
+
+      return configFile.contents;
+    }
   },
 
   async transform({asset, resolve, config, options}) {
-    // stylus should be installed locally in the module that's being required
-    let stylus = await options.packageManager.require('stylus', asset.filePath);
-
+    let stylusConfig = config ?? {};
     let code = await asset.getCode();
-    let style = stylus(code, config);
+    let style = stylus(code, {...stylusConfig});
     style.set('filename', asset.filePath);
     style.set('include css', true);
     // Setup a handler for the URL function so we add dependencies for linked assets.
-    style.define('url', node => {
-      let filename = asset.addURLDependency(node.val, node.filename);
+    style.define('url', (node: stylus.nodes.String | stylus.nodes.Literal) => {
+      let filename = asset.addURLDependency(node.val, {
+        loc: createDependencyLocation(
+          {line: node.lineno, column: node.column},
+          node.val,
+        ),
+      });
       return new stylus.nodes.Literal(`url(${JSON.stringify(filename)})`);
     });
+
+    let {resolved: stylusPath} = await options.packageManager.resolve(
+      'stylus',
+      __filename,
+    );
+    let nativeGlob = await options.packageManager.require('glob', stylusPath);
+
     style.set(
       'Evaluator',
-      await createEvaluator(code, asset, resolve, style.options, options),
+      await createEvaluator(
+        code,
+        asset,
+        resolve,
+        style.options,
+        options,
+        nativeGlob,
+      ),
     );
 
     asset.type = 'css';
@@ -36,7 +74,45 @@ export default new Transformer({
     asset.meta.hasDependencies = false;
     return [asset];
   },
-});
+}): Transformer);
+
+function attemptResolve(importedPath, filepath, asset, resolve, deps) {
+  if (deps.has(importedPath)) {
+    return;
+  }
+
+  if (isGlob(importedPath)) {
+    // Invalidate when new files are created that match the glob pattern.
+    let absoluteGlob = path.resolve(path.dirname(filepath), importedPath);
+    asset.invalidateOnFileCreate({glob: absoluteGlob});
+
+    deps.set(
+      importedPath,
+      glob(absoluteGlob, asset.fs, {
+        onlyFiles: true,
+      }).then(entries =>
+        Promise.all(
+          entries.map(entry =>
+            resolve(
+              filepath,
+              './' + path.relative(path.dirname(filepath), entry),
+              {
+                packageConditions: ['stylus', 'style'],
+              },
+            ),
+          ),
+        ),
+      ),
+    );
+  } else {
+    deps.set(
+      importedPath,
+      resolve(filepath, importedPath, {
+        packageConditions: ['stylus', 'style'],
+      }),
+    );
+  }
+}
 
 async function getDependencies(
   code,
@@ -45,14 +121,11 @@ async function getDependencies(
   resolve,
   options,
   parcelOptions,
+  nativeGlob,
   seen = new Set(),
+  includeImports = true,
 ) {
   seen.add(filepath);
-  const [Parser, DepsResolver, nodes, utils] = await Promise.all(
-    ['parser', 'visitor/deps-resolver', 'nodes', 'utils'].map(dep =>
-      parcelOptions.packageManager.require('stylus/lib/' + dep, filepath),
-    ),
-  );
 
   nodes.filename = asset.filePath;
 
@@ -60,35 +133,16 @@ async function getDependencies(
   let ast = parser.parse();
   let deps = new Map();
 
+  if (includeImports && options.imports) {
+    for (let importedPath of options.imports) {
+      attemptResolve(importedPath, filepath, asset, resolve, deps);
+    }
+  }
+
   class ImportVisitor extends DepsResolver {
     visitImport(imported) {
       let importedPath = imported.path.first.string;
-
-      if (!deps.has(importedPath)) {
-        if (isGlob(importedPath)) {
-          deps.set(
-            importedPath,
-            glob(
-              path.resolve(path.dirname(filepath), importedPath),
-              parcelOptions.inputFS,
-              {
-                onlyFiles: true,
-              },
-            ).then(entries =>
-              Promise.all(
-                entries.map(entry =>
-                  resolve(
-                    filepath,
-                    './' + path.relative(path.dirname(filepath), entry),
-                  ),
-                ),
-              ),
-            ),
-          );
-        } else {
-          deps.set(importedPath, resolve(filepath, importedPath));
-        }
-      }
+      attemptResolve(importedPath, filepath, asset, resolve, deps);
     }
   }
 
@@ -105,7 +159,7 @@ async function getDependencies(
       }
 
       let found;
-      if (resolved) {
+      if (resolved && (!Array.isArray(resolved) || resolved.length > 0)) {
         found = Array.isArray(resolved) ? resolved : [resolved];
         res.set(importedPath, resolved);
       } else {
@@ -118,12 +172,24 @@ async function getDependencies(
           importedPath += '.styl';
         }
 
-        let paths = (options.paths || []).concat(path.dirname(filepath || '.'));
+        // Patch the native FS so we use Parcel's FS, and track files that are
+        // checked so we invalidate the cache when they are created.
+        let restore = patchNativeFS(asset.fs, nativeGlob);
+
+        let paths = [
+          ...new Set(
+            (options.paths || []).concat(path.dirname(filepath || '.')),
+          ),
+        ];
         found = utils.find(importedPath, paths, filepath);
         if (!found) {
           found = utils.lookupIndex(originalPath, paths, filepath);
         }
 
+        for (let invalidation of restore()) {
+          asset.invalidateOnFileCreate(invalidation);
+        }
+
         if (!found) {
           throw new Error('failed to locate file ' + originalPath);
         }
@@ -132,7 +198,7 @@ async function getDependencies(
       // Recursively process resolved files as well to get nested deps
       for (let resolved of found) {
         if (!seen.has(resolved)) {
-          await asset.addIncludedFile({filePath: resolved});
+          asset.invalidateOnFileChange(resolved);
 
           let code = await asset.fs.readFile(resolved, 'utf8');
           for (let [path, resolvedPath] of await getDependencies(
@@ -142,7 +208,9 @@ async function getDependencies(
             resolve,
             options,
             parcelOptions,
+            nativeGlob,
             seen,
+            false,
           )) {
             res.set(path, resolvedPath);
           }
@@ -154,7 +222,14 @@ async function getDependencies(
   return res;
 }
 
-async function createEvaluator(code, asset, resolve, options, parcelOptions) {
+async function createEvaluator(
+  code,
+  asset,
+  resolve,
+  options,
+  parcelOptions,
+  nativeGlob,
+) {
   const deps = await getDependencies(
     code,
     asset.filePath,
@@ -162,10 +237,7 @@ async function createEvaluator(code, asset, resolve, options, parcelOptions) {
     resolve,
     options,
     parcelOptions,
-  );
-  const Evaluator = await parcelOptions.packageManager.require(
-    'stylus/lib/visitor/evaluator',
-    asset.filePath,
+    nativeGlob,
   );
 
   // This is a custom stylus evaluator that extends stylus with support for the node
@@ -190,21 +262,79 @@ async function createEvaluator(code, asset, resolve, options, parcelOptions) {
             return mergeBlocks(
               resolved.map(resolvedPath => {
                 node.string = resolvedPath;
-                return super.visitImport(imported.clone());
+                let restore = patchNativeFS(asset.fs, nativeGlob);
+                let res = super.visitImport(imported.clone());
+                restore();
+                return res;
               }),
             );
           }
         }
       }
 
+      // Patch the native FS so stylus uses Parcel's FS to read the file.
+      let restore = patchNativeFS(asset.fs, nativeGlob);
+
       // Done. Let stylus do its thing.
-      return super.visitImport(imported);
+      let res = super.visitImport(imported);
+
+      restore();
+      return res;
     }
   }
 
   return CustomEvaluator;
 }
 
+function patchNativeFS(fs, nativeGlob) {
+  let invalidations = [];
+  let readFileSync = nativeFS.readFileSync;
+  let statSync = nativeFS.statSync;
+
+  // $FlowFixMe
+  nativeFS.readFileSync = (filename, encoding) => {
+    return fs.readFileSync(filename, encoding);
+  };
+
+  // $FlowFixMe
+  nativeFS.statSync = p => {
+    try {
+      return fs.statSync(p);
+    } catch (err) {
+      // Track files that were checked but don't exist so that we watch for their creation.
+      if (!p.includes(`node_modules${path.sep}stylus`)) {
+        invalidations.push({filePath: p});
+      }
+      throw err;
+    }
+  };
+
+  // Patch the `glob` module as well so we use the Parcel FS and track invalidations.
+  let glob = nativeGlob.sync;
+  nativeGlob.sync = p => {
+    let res = globSync(p, fs);
+    if (!p.includes(`node_modules${path.sep}stylus`)) {
+      // Sometimes stylus passes file paths with no glob parts to the `glob` module.
+      // We want to avoid treating these as globs for performance.
+      if (isGlob(p)) {
+        invalidations.push({glob: p});
+      } else if (res.length === 0) {
+        invalidations.push({filePath: p});
+      }
+    }
+    return res;
+  };
+
+  return () => {
+    // $FlowFixMe
+    nativeFS.readFileSync = readFileSync;
+    // $FlowFixMe
+    nativeFS.statSync = statSync;
+    nativeGlob.sync = glob;
+    return invalidations;
+  };
+}
+
 /**
  * Puts the content of all given node blocks into the first one, essentially merging them.
  */