Repository: codesandbox/codesandbox-client (language: javascript)

Issue:
ESM: Support for Subpath patterns 
# 🌈 Feature

Ability to handle [subpath patterns](https://nodejs.org/api/packages.html#packages_subpath_patterns) 

### What is this feature? 
A few libraries with a lot of exports would prefer to use the above pattern while creating exports and this current breaks in CSB example sandbox https://codesandbox.io/s/kind-payne-i2eb3?file=/src/App.tsx for https://github.com/pmndrs/jotai 

The feature or maybe even a bug would be to add resolution handlers for the `exports` field to have glob patterns and absolute file paths.

### How the feature should work? 

> The feature or maybe even a bug would be to add resolution handlers for the `exports` field to have glob patterns and absolute file paths.

### You have examples or an idea how it can be implemented? 

You can follow the node docs https://nodejs.org/api/packages.html#packages_subpath_patterns , as this was added to both v12 and v14 and already supported by v16 

I wouldn't mind raising a PR but I was unable to find the point of generation for packages. I'm assuming it's the `sandpack` package code but I'm not sure



Discussion / hints:

Fix patch:
diff --git a/.eslintrc b/.eslintrc
index d71b37fdf96..a08b279c41b 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -63,7 +63,7 @@
     ],
     "jsx-a11y/label-has-for": "off",
     "no-bitwise": "off",
-    "arrow-body-style": ["error", "as-needed"],
+    "arrow-body-style": "off",
     "no-restricted-globals": "off",
     "no-restricted-syntax": "off",
     "lines-between-class-members": [
diff --git a/packages/app/package.json b/packages/app/package.json
index 6ea1de7384a..aec44aeab33 100644
--- a/packages/app/package.json
+++ b/packages/app/package.json
@@ -107,7 +107,6 @@
     "babel-standalone": "^6.25.0",
     "base64-loader": "^1.0.0",
     "browser-detect": "^0.2.28",
-    "browser-resolve": "CompuIves/node-browser-resolve",
     "circular-json": "^0.4.0",
     "codemirror": "^5.27.4",
     "codesandbox-api": "0.0.32",
diff --git a/packages/app/src/sandbox/eval/presets/angular-cli/index.ts b/packages/app/src/sandbox/eval/presets/angular-cli/index.ts
index 98e7ed4da52..d3804ddb197 100644
--- a/packages/app/src/sandbox/eval/presets/angular-cli/index.ts
+++ b/packages/app/src/sandbox/eval/presets/angular-cli/index.ts
@@ -172,7 +172,7 @@ async function addAngularCLIResources(manager: Manager) {
 export default function initialize() {
   const preset = new Preset(
     'angular-cli',
-    ['web.ts', 'ts', 'json', 'web.tsx', 'tsx', 'js'],
+    ['web.ts', 'ts', 'json', 'web.tsx', 'tsx', 'js', 'cjs'],
     {},
     {
       setup: async manager => {
@@ -251,7 +251,7 @@ export default function initialize() {
     { transpiler: csbDynamicImportTranspiler },
   ]);
 
-  preset.registerTranspiler(module => /\.m?js$/.test(module.path), [
+  preset.registerTranspiler(module => /\.(m|c)?js$/.test(module.path), [
     {
       transpiler: babelTranspiler,
       options: {
diff --git a/packages/app/src/sandbox/eval/presets/create-react-app-typescript/index.ts b/packages/app/src/sandbox/eval/presets/create-react-app-typescript/index.ts
index 6e32939cbba..abd321b9395 100644
--- a/packages/app/src/sandbox/eval/presets/create-react-app-typescript/index.ts
+++ b/packages/app/src/sandbox/eval/presets/create-react-app-typescript/index.ts
@@ -14,6 +14,7 @@ export default function initialize() {
     'tsx',
     'js',
     'mjs',
+    'cjs',
   ]);
 
   preset.registerTranspiler(module => /\.css$/.test(module.path), [
@@ -67,7 +68,7 @@ export default function initialize() {
   };
   preset.registerTranspiler(
     module =>
-      /\.m?(t|j)sx?$/.test(module.path) && !module.path.endsWith('.d.ts'),
+      /\.(c|m)?(t|j)sx?$/.test(module.path) && !module.path.endsWith('.d.ts'),
     [
       {
         transpiler: babelTranspiler,
diff --git a/packages/app/src/sandbox/eval/presets/create-react-app/utils/reactPreset.ts b/packages/app/src/sandbox/eval/presets/create-react-app/utils/reactPreset.ts
index 438a8a21552..2dfec3409ef 100644
--- a/packages/app/src/sandbox/eval/presets/create-react-app/utils/reactPreset.ts
+++ b/packages/app/src/sandbox/eval/presets/create-react-app/utils/reactPreset.ts
@@ -40,6 +40,7 @@ export const reactPreset = babelConfig => {
       'json',
       'web.jsx',
       'jsx',
+      'cjs',
     ],
     aliases,
     {
@@ -74,9 +75,9 @@ export const reactPreset = babelConfig => {
 
             preset.registerTranspiler(
               module =>
-                !module.path.startsWith('/node_modules') &&
-                /\.m?(t|j)sx?$/.test(module.path) &&
-                !module.path.endsWith('.d.ts'),
+                /^(?!\/node_modules\/).*\.(((m|c)?jsx?)|tsx)$/.test(
+                  module.path
+                ),
               [
                 {
                   transpiler: babelTranspiler,
@@ -99,9 +100,12 @@ export const reactPreset = babelConfig => {
           }
 
           preset.registerTranspiler(
-            module =>
-              /\.m?(t|j)sx?$/.test(module.path) &&
-              !module.path.endsWith('.d.ts'),
+            module => {
+              return (
+                /\.(m|c)?(t|j)sx?$/.test(module.path) &&
+                !module.path.endsWith('.d.ts')
+              );
+            },
             [{ transpiler: babelTranspiler, options: babelConfig }]
           );
 
diff --git a/packages/app/src/sandbox/eval/presets/cxjs/index.ts b/packages/app/src/sandbox/eval/presets/cxjs/index.ts
index e3c1b4fbc6f..4e3b81c6b70 100644
--- a/packages/app/src/sandbox/eval/presets/cxjs/index.ts
+++ b/packages/app/src/sandbox/eval/presets/cxjs/index.ts
@@ -18,7 +18,7 @@ export default function initialize() {
     {}
   );
 
-  cxjsPreset.registerTranspiler(module => /\.m?jsx?$/.test(module.path), [
+  cxjsPreset.registerTranspiler(module => /\.(c|m)?jsx?$/.test(module.path), [
     {
       transpiler: babelTranspiler,
       options: {
diff --git a/packages/app/src/sandbox/eval/presets/dojo/index.ts b/packages/app/src/sandbox/eval/presets/dojo/index.ts
index f0300a6a22b..54f407f76e5 100644
--- a/packages/app/src/sandbox/eval/presets/dojo/index.ts
+++ b/packages/app/src/sandbox/eval/presets/dojo/index.ts
@@ -42,7 +42,7 @@ export default function initialize() {
     { transpiler: csbDynamicImportTranspiler },
   ]);
 
-  preset.registerTranspiler(module => /\.m?jsx?$/.test(module.path), [
+  preset.registerTranspiler(module => /\.(c|m)?jsx?$/.test(module.path), [
     {
       transpiler: babelTranspiler,
       options: {
diff --git a/packages/app/src/sandbox/eval/presets/parcel/index.ts b/packages/app/src/sandbox/eval/presets/parcel/index.ts
index 8a7a542d6e4..5f6e627ebc8 100644
--- a/packages/app/src/sandbox/eval/presets/parcel/index.ts
+++ b/packages/app/src/sandbox/eval/presets/parcel/index.ts
@@ -25,6 +25,8 @@ export default function initialize() {
     'parcel',
     [
       'js',
+      'mjs',
+      'cjs',
       'jsx',
       'ts',
       'tsx',
@@ -54,7 +56,7 @@ export default function initialize() {
     { transpiler: babelTranspiler },
   ]);
 
-  parcelPreset.registerTranspiler(module => /\.m?jsx?$/.test(module.path), [
+  parcelPreset.registerTranspiler(module => /\.(m|c)?jsx?$/.test(module.path), [
     {
       transpiler: babelTranspiler,
       options: {
diff --git a/packages/app/src/sandbox/eval/presets/preact-cli/preset.ts b/packages/app/src/sandbox/eval/presets/preact-cli/preset.ts
index 1c158023108..5d71b8686f6 100644
--- a/packages/app/src/sandbox/eval/presets/preact-cli/preset.ts
+++ b/packages/app/src/sandbox/eval/presets/preact-cli/preset.ts
@@ -24,16 +24,19 @@ export default function PreactPreset() {
     }
   );
 
-  preactPreset.registerTranspiler(module => /\.m?(t|j)sx?$/.test(module.path), [
-    {
-      transpiler: babelTranspiler,
-      options: {
-        isV7: true,
-        compileNodeModulesWithEnv: true,
-        // config is derived from babelrc at packages/common/src/templates/configuration/babelrc/index.ts
+  preactPreset.registerTranspiler(
+    module => /\.(m|c)?(t|j)sx?$/.test(module.path),
+    [
+      {
+        transpiler: babelTranspiler,
+        options: {
+          isV7: true,
+          compileNodeModulesWithEnv: true,
+          // config is derived from babelrc at packages/common/src/templates/configuration/babelrc/index.ts
+        },
       },
-    },
-  ]);
+    ]
+  );
 
   // For these routes we need to enable css modules
   const cssModulesPaths = [
diff --git a/packages/app/src/sandbox/eval/presets/reason/index.ts b/packages/app/src/sandbox/eval/presets/reason/index.ts
index 7a0cc99c2b0..64477dd2f70 100644
--- a/packages/app/src/sandbox/eval/presets/reason/index.ts
+++ b/packages/app/src/sandbox/eval/presets/reason/index.ts
@@ -20,7 +20,7 @@ export default function initialize() {
     { transpiler: stylesTranspiler },
   ]);
 
-  preset.registerTranspiler(module => /\.m?jsx?$/.test(module.path), [
+  preset.registerTranspiler(module => /\.(m|c)?jsx?$/.test(module.path), [
     { transpiler: babelTranspiler },
   ]);
 
diff --git a/packages/app/src/sandbox/eval/presets/stencil/index.ts b/packages/app/src/sandbox/eval/presets/stencil/index.ts
index 81aa01f2eae..416e9bfeb75 100644
--- a/packages/app/src/sandbox/eval/presets/stencil/index.ts
+++ b/packages/app/src/sandbox/eval/presets/stencil/index.ts
@@ -27,7 +27,7 @@ export default function initialize() {
     { transpiler: stencilTranspiler },
   ]);
 
-  stencilPreset.registerTranspiler(module => /\.mjs$/.test(module.path), [
+  stencilPreset.registerTranspiler(module => /\.(m|c)js$/.test(module.path), [
     { transpiler: stencilTranspiler },
     { transpiler: babelTranspiler, options: babelOptions },
   ]);
diff --git a/packages/app/src/sandbox/eval/presets/svelte/index.ts b/packages/app/src/sandbox/eval/presets/svelte/index.ts
index b8f08f683f5..65b2ae88c56 100644
--- a/packages/app/src/sandbox/eval/presets/svelte/index.ts
+++ b/packages/app/src/sandbox/eval/presets/svelte/index.ts
@@ -22,7 +22,7 @@ const babelOptions = {
 export default function initialize() {
   const sveltePreset = new Preset('svelte', ['js', 'jsx', 'svelte'], {});
 
-  sveltePreset.registerTranspiler(module => /\.m?jsx?$/.test(module.path), [
+  sveltePreset.registerTranspiler(module => /\.(m|c)?jsx?$/.test(module.path), [
     { transpiler: babelTranspiler, options: babelOptions },
   ]);
 
diff --git a/packages/app/src/sandbox/eval/presets/vue-cli/v2.ts b/packages/app/src/sandbox/eval/presets/vue-cli/v2.ts
index 8907a890b71..a580007a657 100644
--- a/packages/app/src/sandbox/eval/presets/vue-cli/v2.ts
+++ b/packages/app/src/sandbox/eval/presets/vue-cli/v2.ts
@@ -62,7 +62,7 @@ export default function initialize(vuePreset: Preset) {
     });
   }
 
-  vuePreset.registerTranspiler(module => /\.m?jsx?$/.test(module.path), [
+  vuePreset.registerTranspiler(module => /\.(m|c)?jsx?$/.test(module.path), [
     { transpiler: babelTranspiler },
   ]);
   vuePreset.registerTranspiler(module => /\.m?tsx?$/.test(module.path), [
diff --git a/packages/app/src/sandbox/eval/presets/vue-cli/v3.ts b/packages/app/src/sandbox/eval/presets/vue-cli/v3.ts
index d30f36dddd5..72d4063256a 100644
--- a/packages/app/src/sandbox/eval/presets/vue-cli/v3.ts
+++ b/packages/app/src/sandbox/eval/presets/vue-cli/v3.ts
@@ -65,7 +65,7 @@ export default async function initialize(vuePreset: Preset) {
     });
   }
 
-  vuePreset.registerTranspiler(module => /\.m?jsx?$/.test(module.path), [
+  vuePreset.registerTranspiler(module => /\.(m|c)?jsx?$/.test(module.path), [
     { transpiler: babelTranspiler },
   ]);
   vuePreset.registerTranspiler(module => /\.m?tsx?$/.test(module.path), [
diff --git a/packages/app/src/sandbox/eval/transpilers/babel/worker/babel-worker.js b/packages/app/src/sandbox/eval/transpilers/babel/worker/babel-worker.js
index 68260242946..26e70762f76 100644
--- a/packages/app/src/sandbox/eval/transpilers/babel/worker/babel-worker.js
+++ b/packages/app/src/sandbox/eval/transpilers/babel/worker/babel-worker.js
@@ -529,16 +529,14 @@ async function compile(opts: any) {
       dependencies,
     };
   } catch (err) {
-    if (
-      !fsInitialized &&
-      (err.message.indexOf('Cannot find module') > -1 || err.code === 'EIO')
-    ) {
+    const isModuleNotFoundError = err.code === 'MODULE_NOT_FOUND';
+    if (!fsInitialized && (isModuleNotFoundError || err.code === 'EIO')) {
       // BrowserFS was needed but wasn't initialized
       await waitForFs(loaderContextId);
       return compile(opts);
     }
 
-    if (err.message.indexOf('Cannot find module') > -1) {
+    if (isModuleNotFoundError) {
       // Try to download the file and all dependencies, retry compilation then
       await downloadFromError({
         error: err,
diff --git a/packages/app/src/sandbox/eval/transpilers/babel/worker/dynamic-download.ts b/packages/app/src/sandbox/eval/transpilers/babel/worker/dynamic-download.ts
index be70e1c79f5..eba211cd896 100644
--- a/packages/app/src/sandbox/eval/transpilers/babel/worker/dynamic-download.ts
+++ b/packages/app/src/sandbox/eval/transpilers/babel/worker/dynamic-download.ts
@@ -1,10 +1,11 @@
-import resolve from 'browser-resolve';
 import { getGlobal } from '@codesandbox/common/lib/utils/global';
+import { ModuleNotFoundError } from 'sandpack-core/lib/resolver/errors/ModuleNotFound';
+
 import getRequireStatements from './simple-get-require-statements';
-import { packageFilter } from '../../../utils/resolve-utils';
 import { convertEsModule } from '../ast/convert-esmodule';
 import { generateCode, parseModule } from '../ast/utils';
 import { ChildHandler } from '../../worker-transpiler/child-handler';
+import { resolve } from './utils/resolve';
 
 const global = getGlobal();
 const path = global.BrowserFS.BFSRequire('path');
@@ -110,11 +111,9 @@ function downloadRequires(
         }
 
         try {
-          resolve.sync(foundR.path, {
+          resolve(foundR.path, {
             filename: currentPath,
             extensions: ['.js', '.json'],
-            moduleDirectory: ['node_modules'],
-            packageFilter,
           });
         } catch (err) {
           await downloadFromError({
@@ -218,22 +217,34 @@ export async function downloadPath(
   return r;
 }
 
+function extractPathFromError(err: Error | ModuleNotFoundError): string {
+  if (err instanceof ModuleNotFoundError) {
+    return err.filepath;
+  }
+
+  if (err.message.indexOf('Cannot find module') > -1) {
+    const dep = err.message.match(/Cannot find module '(.*?)'/)[1];
+    const from = err.message.match(/from '(.*?)'/)[1];
+    const absolutePath = dep.startsWith('.') ? path.join(from, dep) : dep;
+
+    return absolutePath;
+  }
+
+  return null;
+}
+
 export function downloadFromError(opts: {
   error: Error;
   childHandler: ChildHandler;
   loaderContextId: number;
 }) {
   const { error, childHandler, loaderContextId } = opts;
-  if (error.message.indexOf('Cannot find module') > -1) {
-    const dep = error.message.match(/Cannot find module '(.*?)'/)[1];
-    const from = error.message.match(/from '(.*?)'/)[1];
-    const absolutePath = dep.startsWith('.') ? path.join(from, dep) : dep;
-
-    return downloadPath(absolutePath, {
+  const moduleSpecifier = extractPathFromError(error);
+  if (moduleSpecifier) {
+    return downloadPath(moduleSpecifier, {
       childHandler,
       loaderContextId,
     });
   }
-
   return Promise.resolve();
 }
diff --git a/packages/app/src/sandbox/eval/transpilers/babel/worker/evaluate.js b/packages/app/src/sandbox/eval/transpilers/babel/worker/evaluate.js
index 5a3d15271f3..6e50b756205 100644
--- a/packages/app/src/sandbox/eval/transpilers/babel/worker/evaluate.js
+++ b/packages/app/src/sandbox/eval/transpilers/babel/worker/evaluate.js
@@ -1,4 +1,3 @@
-import resolve from 'browser-resolve';
 import hashsum from 'hash-sum';
 import * as events from 'events';
 import * as crypto from 'crypto';
@@ -8,8 +7,8 @@ import type FSType from 'fs';
 import isESModule from 'sandbox/eval/utils/is-es-module';
 import evaluateCode from 'sandpack-core/lib/runner/eval';
 import detectOldBrowser from '@codesandbox/common/lib/detect-old-browser';
-import { packageFilter } from '../../../utils/resolve-utils';
-import { patchedResolve } from './utils/resolvePatch';
+
+import { resolve } from './utils/resolve';
 import { getBabelTypes } from './utils/babelTypes';
 
 let cache = {};
@@ -67,7 +66,7 @@ export default function evaluate(
     }
 
     if (requirePath === 'resolve') {
-      return patchedResolve();
+      return (...args) => resolve(...args);
     }
 
     if (requirePath === 'babel-register') {
@@ -132,11 +131,9 @@ export default function evaluate(
 
     const resolvedPath =
       cachedPaths[dirName][requirePath] ||
-      resolve.sync(requirePath, {
+      resolve(requirePath, {
         filename: path,
         extensions: ['.js', '.json'],
-        moduleDirectory: ['node_modules'],
-        packageFilter,
       });
 
     cachedPaths[dirName][requirePath] = resolvedPath;
@@ -206,11 +203,9 @@ export function evaluateFromPath(
   availablePlugins: Object,
   availablePresets: Object
 ) {
-  const resolvedPath = resolve.sync(path, {
-    filename: currentPath,
+  const resolvedPath = resolve(path, {
+    filename: path,
     extensions: ['.js', '.json'],
-    moduleDirectory: ['node_modules'],
-    packageFilter,
   });
 
   const code = fs.readFileSync(resolvedPath).toString();
diff --git a/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/macrosPatch.ts b/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/macrosPatch.ts
index 881cb531749..0ce82814aa1 100644
--- a/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/macrosPatch.ts
+++ b/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/macrosPatch.ts
@@ -1,13 +1,13 @@
 import * as macrosPlugin from 'babel-plugin-macros';
-import { patchedResolve } from './resolvePatch';
+import { resolve } from './resolve';
 
 // eslint-disable-next-line
 let finalExports = function m(babel, options) {
   return macrosPlugin(babel, {
     ...options,
     resolvePath(source, basePath) {
-      return patchedResolve().sync(source, {
-        basePath,
+      return resolve(source, {
+        filename: basePath + '/index',
       });
     },
   });
diff --git a/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/resolve.ts b/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/resolve.ts
new file mode 100644
index 00000000000..c5df6bc0492
--- /dev/null
+++ b/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/resolve.ts
@@ -0,0 +1,39 @@
+import {
+  resolveSync,
+  IResolveOptionsInput,
+} from 'sandpack-core/lib/resolver/resolver';
+import gensync from 'gensync';
+
+/**
+ * Patch 'resolve' to configure it to resolve esmodules by default. babel-plugin-macros goes
+ * for the commonjs version, which we don't download anymore by default.
+ */
+export function resolve(
+  specifier: string,
+  opts: Partial<IResolveOptionsInput>
+) {
+  const fs = global.BrowserFS.BFSRequire('fs');
+
+  const isFile = p => {
+    try {
+      const stats = fs.statSync(p);
+      return stats.isFile();
+    } catch (err) {
+      return false;
+    }
+  };
+
+  const resolvedPath = resolveSync(specifier, {
+    filename: '/index.js', // idk...
+    extensions: ['.js', '.mjs', '.json', '.ts', '.tsx'],
+    moduleDirectories: ['node_modules'],
+    ...opts,
+    isFile: gensync({
+      sync: p => isFile(p),
+    }),
+    readFile: gensync({
+      sync: p => fs.readFileSync(p, 'utf8'),
+    }),
+  });
+  return resolvedPath;
+}
diff --git a/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/resolvePatch.ts b/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/resolvePatch.ts
index 4aca9ef08fa..2a7b4f19912 100644
--- a/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/resolvePatch.ts
+++ b/packages/app/src/sandbox/eval/transpilers/babel/worker/utils/resolvePatch.ts
@@ -1,5 +1,11 @@
-import * as resolve from 'browser-resolve';
-import { packageFilter } from 'sandbox/eval/utils/resolve-utils';
+import { resolve } from './resolve';
+
+function transformOptions(opts: any): any {
+  return {
+    ...opts,
+    filename: opts.basePath ? opts.basePath + '/index.js' : '/index.js',
+  };
+}
 
 /**
  * Patch 'resolve' to configure it to resolve esmodules by default. babel-plugin-macros goes
@@ -9,11 +15,16 @@ export function patchedResolve() {
   const handler = {
     get(target, prop) {
       if (prop === 'sync') {
-        return (p, options) => target.sync(p, { ...options, packageFilter });
+        return (p, options) => {
+          resolve(p, transformOptions(options));
+        };
       }
 
-      return target[prop];
+      // Useful for logging if somethings sync or not...
+      return (p, options) => {
+        resolve(p, transformOptions(options));
+      };
     },
   };
-  return new Proxy(resolve, handler);
+  return new Proxy({}, handler);
 }
diff --git a/packages/sandpack-core/package.json b/packages/sandpack-core/package.json
index f32fd2bce12..ba67e3687b7 100644
--- a/packages/sandpack-core/package.json
+++ b/packages/sandpack-core/package.json
@@ -22,7 +22,6 @@
   "dependencies": {
     "@babel/runtime": "^7.11.2",
     "@codesandbox/common": "^1.0.8",
-    "browser-resolve": "CompuIves/node-browser-resolve",
     "codesandbox-api": "0.0.32",
     "fs-extra": "^9.1.0",
     "gensync": "^1.0.0-beta.2",
diff --git a/packages/sandpack-core/src/cache.ts b/packages/sandpack-core/src/cache.ts
index 4dd2df06a29..d6f5405202a 100644
--- a/packages/sandpack-core/src/cache.ts
+++ b/packages/sandpack-core/src/cache.ts
@@ -113,8 +113,8 @@ export async function saveCache(
       .then(x => x.json())
       .catch(e => {
         if (process.env.NODE_ENV === 'development') {
-          console.error('Something went wrong while saving cache.');
-          console.error(e);
+          console.warn('Something went wrong while saving cache.');
+          console.warn(e);
         }
       });
   }
diff --git a/packages/sandpack-core/src/manager.ts b/packages/sandpack-core/src/manager.ts
index 4de0505741a..d6bda45116f 100644
--- a/packages/sandpack-core/src/manager.ts
+++ b/packages/sandpack-core/src/manager.ts
@@ -1,6 +1,5 @@
 import { flattenDeep, uniq, values } from 'lodash-es';
 import { Protocol } from 'codesandbox-api';
-import { default as bresolve } from 'browser-resolve';
 import fs from 'fs';
 import gensync from 'gensync';
 
@@ -13,6 +12,7 @@ import { endMeasure, now } from '@codesandbox/common/lib/utils/metrics';
 import DependencyNotFoundError from 'sandbox-hooks/errors/dependency-not-found-error';
 import ModuleNotFoundError from 'sandbox-hooks/errors/module-not-found-error';
 
+import { PackageCache, resolveAsync, resolveSync } from './resolver/resolver';
 import { generateBenchmarkInterface } from './utils/benchmark';
 import { Module } from './types/module';
 import {
@@ -31,7 +31,6 @@ import {
   getAliasVersion,
   getDependencyName,
 } from './utils/get-dependency-name';
-import { packageFilter } from './utils/resolve-utils';
 
 import {
   ignoreNextCache,
@@ -194,6 +193,7 @@ export default class Manager implements IEvaluator {
   // All paths are resolved at least twice: during transpilation and evaluation.
   // We can improve performance by almost 2x in this scenario if we cache the lookups
   cachedPaths: { [path: string]: { [path: string]: string } };
+  resolverPackageCache: PackageCache;
 
   configurations: ParsedConfigurationFiles;
 
@@ -225,6 +225,7 @@ export default class Manager implements IEvaluator {
     this.stage = 'transpilation';
     this.version = options.versionIdentifier;
     this.esmodules = new Map();
+    this.resolverPackageCache = new Map();
 
     /**
      * Contribute the file fetcher, which needs the manager to resolve the files
@@ -279,6 +280,12 @@ export default class Manager implements IEvaluator {
     prependToContributedProtocols([protocol]);
   }
 
+  // Call this whenever the file structure or modules change, so before each compilation...
+  resetResolverCache() {
+    this.cachedPaths = {};
+    this.resolverPackageCache = new Map();
+  }
+
   async evaluate(path: string, baseTModule?: TranspiledModule): Promise<any> {
     const tModule = await this.resolveTranspiledModuleAsync(
       path,
@@ -559,8 +566,8 @@ export default class Manager implements IEvaluator {
   }
 
   removeModule(module: Module) {
-    // Reset all cached paths because file structure changed
-    this.cachedPaths = {};
+    // File structure changed, reset resolver cache
+    this.resetResolverCache();
 
     const existingModule = this.transpiledModules[module.path];
 
@@ -817,25 +824,13 @@ export default class Manager implements IEvaluator {
       }
 
       try {
-        resolvedPath = await new Promise((resolvePromise, rejectPromise) => {
-          bresolve(
-            shimmedPath,
-            {
-              // @ts-ignore
-              filename: parentPath,
-              extensions: defaultExtensions.map(ext => '.' + ext),
-              isFile: this.isFile.errback,
-              readFile: this.readFile.errback,
-              packageFilter,
-              moduleDirectory: this.getModuleDirectories(),
-            },
-            (err: Error | undefined, foundPath: string) => {
-              if (err) {
-                return rejectPromise(err);
-              }
-              return resolvePromise(foundPath);
-            }
-          );
+        resolvedPath = await resolveAsync(shimmedPath, {
+          filename: parentPath,
+          extensions: defaultExtensions.map(ext => '.' + ext),
+          isFile: this.isFile,
+          readFile: this.readFile,
+          moduleDirectories: this.getModuleDirectories(),
+          packageCache: this.resolverPackageCache,
         });
 
         endMeasure(measureKey, { silent: true, lastTime: measureStartTime });
@@ -974,14 +969,13 @@ export default class Manager implements IEvaluator {
       }
 
       try {
-        resolvedPath = bresolve.sync(shimmedPath, {
-          // @ts-ignore
+        resolvedPath = resolveSync(shimmedPath, {
           filename: parentPath,
           extensions: defaultExtensions.map(ext => '.' + ext),
-          isFile: this.isFile.sync,
-          readFileSync: this.readFile.sync,
-          packageFilter,
-          moduleDirectory: this.getModuleDirectories(),
+          isFile: this.isFile,
+          readFile: this.readFile,
+          moduleDirectories: this.getModuleDirectories(),
+          packageCache: this.resolverPackageCache,
         });
         endMeasure(measureKey, { silent: true, lastTime: measureStartTime });
 
@@ -1049,12 +1043,12 @@ export default class Manager implements IEvaluator {
     query: string = '',
     ignoredExtensions: Array<string> = this.preset.ignoredExtensions
   ): Promise<TranspiledModule> {
-    return fetchModule(
-      path,
-      currentTModule,
-      this,
-      ignoredExtensions
-    ).then(module => this.getTranspiledModule(module, query));
+    return fetchModule(path, currentTModule, this, ignoredExtensions).then(
+      module => {
+        this.resetResolverCache();
+        return this.getTranspiledModule(module, query);
+      }
+    );
   }
 
   updateModule(m: Module) {
@@ -1207,17 +1201,16 @@ export default class Manager implements IEvaluator {
     const addedModules: Array<Module> = [];
     const updatedModules: Array<Module> = [];
 
+    // File structure likely changed, reset resolver cache
+    this.resetResolverCache();
+
     Object.keys(modules).forEach(k => {
       const module: Module = modules[k];
       const mirrorModule = this.transpiledModules[k];
 
       if (!mirrorModule) {
-        // File structure changed, reset cached paths
-        this.cachedPaths = {};
         addedModules.push(module);
       } else if (mirrorModule.module.code !== module.code) {
-        // File structure changed, reset cached paths
-        this.cachedPaths = {};
         updatedModules.push(module);
       }
     });
diff --git a/packages/sandpack-core/src/npm/dynamic/fetch-npm-module.ts b/packages/sandpack-core/src/npm/dynamic/fetch-npm-module.ts
index 64c519a170d..e3a94db8a93 100644
--- a/packages/sandpack-core/src/npm/dynamic/fetch-npm-module.ts
+++ b/packages/sandpack-core/src/npm/dynamic/fetch-npm-module.ts
@@ -1,5 +1,5 @@
 import * as pathUtils from '@codesandbox/common/lib/utils/path';
-import resolve from 'browser-resolve';
+import gensync from 'gensync';
 import DependencyNotFoundError from 'sandbox-hooks/errors/dependency-not-found-error';
 
 import { Module } from '../../types/module';
@@ -7,9 +7,9 @@ import Manager from '../../manager';
 
 import { getFetchProtocol } from './fetch-protocols';
 import { getDependencyName } from '../../utils/get-dependency-name';
-import { packageFilter } from '../../utils/resolve-utils';
 import { TranspiledModule } from '../../transpiled-module';
 import { DEFAULT_EXTENSIONS } from '../../utils/extensions';
+import { resolveAsync } from '../../resolver/resolver';
 
 export type Meta = {
   [path: string]: true;
@@ -139,94 +139,73 @@ function resolvePath(
 ): Promise<string> {
   const currentPath = currentTModule.module.path;
 
-  const isFile = (p: string, c?: any, cb?: any): any => {
-    const callback = cb || c;
-
-    const result = Boolean(manager.transpiledModules[p]) || Boolean(meta[p]);
-    if (!callback) {
-      return result;
-    }
+  const isFile = gensync({
+    sync: (p: string) =>
+      Boolean(manager.transpiledModules[p]) || Boolean(meta[p]),
+  });
 
-    return callback(null, result);
-  };
+  const readFile = gensync({
+    sync: () => {
+      throw new Error('Sync not supported for readFile');
+    },
+    async: async (p: string): Promise<string> => {
+      try {
+        const tModule = await manager.resolveTranspiledModule(p, '/', []);
+        tModule.initiators.add(currentTModule);
+        currentTModule.dependencies.add(tModule);
+        return tModule.module.code;
+      } catch (e) {
+        const depPath = p.replace(/.*\/node_modules\//, '');
+        const depName = getDependencyName(depPath);
+
+        // To prevent infinite loops we keep track of which dependencies have been requested before.
+        if (!manager.transpiledModules[p] && !meta[p]) {
+          const err = new Error('Could not find ' + p);
+          // @ts-ignore
+          err.code = 'ENOENT';
+
+          throw err;
+        }
 
-  return new Promise((res, reject) => {
-    resolve(
-      path,
-      {
-        filename: currentPath,
-        extensions: defaultExtensions.map(ext => '.' + ext),
-        packageFilter,
-        moduleDirectory: [
-          'node_modules',
-          manager.envVariables.NODE_PATH,
-        ].filter(Boolean),
-        isFile,
-        // @ts-ignore
-        readFile: async (p: string, c, cb) => {
-          const callback = cb || c;
+        // eslint-disable-next-line
+        const subDepVersionVersionInfo = await getDependencyVersion(
+          currentTModule,
+          manager,
+          depName
+        );
 
+        if (subDepVersionVersionInfo) {
+          const { version: subDepVersion } = subDepVersionVersionInfo;
           try {
-            const tModule = await manager.resolveTranspiledModule(p, '/', []);
-            tModule.initiators.add(currentTModule);
-            currentTModule.dependencies.add(tModule);
-            return callback(null, tModule.module.code);
-          } catch (e) {
-            const depPath = p.replace(/.*\/node_modules\//, '');
-            const depName = getDependencyName(depPath);
-
-            // To prevent infinite loops we keep track of which dependencies have been requested before.
-            if (!manager.transpiledModules[p] && !meta[p]) {
-              const err = new Error('Could not find ' + p);
-              // @ts-ignore
-              err.code = 'ENOENT';
-
-              return callback(err);
-            }
+            const module = await downloadDependency(depName, subDepVersion, p);
 
-            // eslint-disable-next-line
-            const subDepVersionVersionInfo = await getDependencyVersion(
-              currentTModule,
-              manager,
-              depName
-            );
-
-            if (subDepVersionVersionInfo) {
-              const { version: subDepVersion } = subDepVersionVersionInfo;
-              try {
-                const module = await downloadDependency(
-                  depName,
-                  subDepVersion,
-                  p
-                );
-
-                if (module) {
-                  manager.addModule(module);
-                  const tModule = manager.addTranspiledModule(module, '');
-
-                  tModule.initiators.add(currentTModule);
-                  currentTModule.dependencies.add(tModule);
-
-                  callback(null, module.code);
-                  return null;
-                }
-              } catch (er) {
-                // Let it throw the error
-              }
-            }
+            if (module) {
+              manager.addModule(module);
+              const tModule = manager.addTranspiledModule(module, '');
+
+              tModule.initiators.add(currentTModule);
+              currentTModule.dependencies.add(tModule);
 
-            return callback(e);
+              return module.code;
+            }
+          } catch (er) {
+            // Let it throw the error
           }
-        },
-      },
-      (err: Error | undefined, resolvedPath: string) => {
-        if (err) {
-          return reject(err);
         }
 
-        return res(resolvedPath);
+        throw e;
       }
-    );
+    },
+  });
+
+  return resolveAsync(path, {
+    filename: currentPath,
+    extensions: defaultExtensions.map(ext => '.' + ext),
+    moduleDirectories: ['node_modules', manager.envVariables.NODE_PATH].filter(
+      Boolean
+    ),
+    isFile,
+    readFile,
   });
 }
 
diff --git a/packages/sandpack-core/src/resolver/errors/ModuleNotFound.ts b/packages/sandpack-core/src/resolver/errors/ModuleNotFound.ts
new file mode 100644
index 00000000000..38bf3eafb56
--- /dev/null
+++ b/packages/sandpack-core/src/resolver/errors/ModuleNotFound.ts
@@ -0,0 +1,11 @@
+export class ModuleNotFoundError extends Error {
+  filepath: string;
+  parent: string;
+  code: string = 'MODULE_NOT_FOUND';
+
+  constructor(filepath: string, parent: string) {
+    super(`Cannot find module ${filepath} in ${parent}`);
+    this.parent = parent;
+    this.filepath = filepath;
+  }
+}
diff --git a/packages/sandpack-core/src/resolver/fixture/node_modules/@babel/runtime/package.json b/packages/sandpack-core/src/resolver/fixture/node_modules/@babel/runtime/package.json
new file mode 100644
index 00000000000..c939ed29be8
--- /dev/null
+++ b/packages/sandpack-core/src/resolver/fixture/node_modules/@babel/runtime/package.json
@@ -0,0 +1,821 @@
+{
+  "name": "@babel/runtime",
+  "version": "7.15.3",
+  "description": "babel's modular runtime helpers",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/babel/babel.git",
+    "directory": "packages/babel-runtime"
+  },
+  "homepage": "https://babel.dev/docs/en/next/babel-runtime",
+  "author": "The Babel Team (https://babel.dev/team)",
+  "dependencies": {
+    "regenerator-runtime": "^0.13.4"
+  },
+  "exports": {
+    "./helpers/jsx": [
+      {
+        "node": "./helpers/jsx.js",
+        "import": "./helpers/esm/jsx.js",
+        "default": "./helpers/jsx.js"
+      },
+      "./helpers/jsx.js"
+    ],
+    "./helpers/esm/jsx": "./helpers/esm/jsx.js",
+    "./helpers/objectSpread2": [
+      {
+        "node": "./helpers/objectSpread2.js",
+        "import": "./helpers/esm/objectSpread2.js",
+        "default": "./helpers/objectSpread2.js"
+      },
+      "./helpers/objectSpread2.js"
+    ],
+    "./helpers/esm/objectSpread2": "./helpers/esm/objectSpread2.js",
+    "./helpers/typeof": [
+      {
+        "node": "./helpers/typeof.js",
+        "import": "./helpers/esm/typeof.js",
+        "default": "./helpers/typeof.js"
+      },
+      "./helpers/typeof.js"
+    ],
+    "./helpers/esm/typeof": "./helpers/esm/typeof.js",
+    "./helpers/wrapRegExp": [
+      {
+        "node": "./helpers/wrapRegExp.js",
+        "import": "./helpers/esm/wrapRegExp.js",
+        "default": "./helpers/wrapRegExp.js"
+      },
+      "./helpers/wrapRegExp.js"
+    ],
+    "./helpers/esm/wrapRegExp": "./helpers/esm/wrapRegExp.js",
+    "./helpers/asyncIterator": [
+      {
+        "node": "./helpers/asyncIterator.js",
+        "import": "./helpers/esm/asyncIterator.js",
+        "default": "./helpers/asyncIterator.js"
+      },
+      "./helpers/asyncIterator.js"
+    ],
+    "./helpers/esm/asyncIterator": "./helpers/esm/asyncIterator.js",
+    "./helpers/AwaitValue": [
+      {
+        "node": "./helpers/AwaitValue.js",
+        "import": "./helpers/esm/AwaitValue.js",
+        "default": "./helpers/AwaitValue.js"
+      },
+      "./helpers/AwaitValue.js"
+    ],
+    "./helpers/esm/AwaitValue": "./helpers/esm/AwaitValue.js",
+    "./helpers/AsyncGenerator": [
+      {
+        "node": "./helpers/AsyncGenerator.js",
+        "import": "./helpers/esm/AsyncGenerator.js",
+        "default": "./helpers/AsyncGenerator.js"
+      },
+      "./helpers/AsyncGenerator.js"
+    ],
+    "./helpers/esm/AsyncGenerator": "./helpers/esm/AsyncGenerator.js",
+    "./helpers/wrapAsyncGenerator": [
+      {
+        "node": "./helpers/wrapAsyncGenerator.js",
+        "import": "./helpers/esm/wrapAsyncGenerator.js",
+        "default": "./helpers/wrapAsyncGenerator.js"
+      },
+      "./helpers/wrapAsyncGenerator.js"
+    ],
+    "./helpers/esm/wrapAsyncGenerator": "./helpers/esm/wrapAsyncGenerator.js",
+    "./helpers/awaitAsyncGenerator": [
+      {
+        "node": "./helpers/awaitAsyncGenerator.js",
+        "import": "./helpers/esm/awaitAsyncGenerator.js",
+        "default": "./helpers/awaitAsyncGenerator.js"
+      },
+      "./helpers/awaitAsyncGenerator.js"
+    ],
+    "./helpers/esm/awaitAsyncGenerator": "./helpers/esm/awaitAsyncGenerator.js",
+    "./helpers/asyncGeneratorDelegate": [
+      {
+        "node": "./helpers/asyncGeneratorDelegate.js",
+        "import": "./helpers/esm/asyncGeneratorDelegate.js",
+        "default": "./helpers/asyncGeneratorDelegate.js"
+      },
+      "./helpers/asyncGeneratorDelegate.js"
+    ],
+    "./helpers/esm/asyncGeneratorDelegate": "./helpers/esm/asyncGeneratorDelegate.js",
+    "./helpers/asyncToGenerator": [
+      {
+        "node": "./helpers/asyncToGenerator.js",
+        "import": "./helpers/esm/asyncToGenerator.js",
+        "default": "./helpers/asyncToGenerator.js"
+      },
+      "./helpers/asyncToGenerator.js"
+    ],
+    "./helpers/esm/asyncToGenerator": "./helpers/esm/asyncToGenerator.js",
+    "./helpers/classCallCheck": [
+      {
+        "node": "./helpers/classCallCheck.js",
+        "import": "./helpers/esm/classCallCheck.js",
+        "default": "./helpers/classCallCheck.js"
+      },
+      "./helpers/classCallCheck.js"
+    ],
+    "./helpers/esm/classCallCheck": "./helpers/esm/classCallCheck.js",
+    "./helpers/createClass": [
+      {
+        "node": "./helpers/createClass.js",
+        "import": "./helpers/esm/createClass.js",
+        "default": "./helpers/createClass.js"
+      },
+      "./helpers/createClass.js"
+    ],
+    "./helpers/esm/createClass": "./helpers/esm/createClass.js",
+    "./helpers/defineEnumerableProperties": [
+      {
+        "node": "./helpers/defineEnumerableProperties.js",
+        "import": "./helpers/esm/defineEnumerableProperties.js",
+        "default": "./helpers/defineEnumerableProperties.js"
+      },
+      "./helpers/defineEnumerableProperties.js"
+    ],
+    "./helpers/esm/defineEnumerableProperties": "./helpers/esm/defineEnumerableProperties.js",
+    "./helpers/defaults": [
+      {
+        "node": "./helpers/defaults.js",
+        "import": "./helpers/esm/defaults.js",
+        "default": "./helpers/defaults.js"
+      },
+      "./helpers/defaults.js"
+    ],
+    "./helpers/esm/defaults": "./helpers/esm/defaults.js",
+    "./helpers/defineProperty": [
+      {
+        "node": "./helpers/defineProperty.js",
+        "import": "./helpers/esm/defineProperty.js",
+        "default": "./helpers/defineProperty.js"
+      },
+      "./helpers/defineProperty.js"
+    ],
+    "./helpers/esm/defineProperty": "./helpers/esm/defineProperty.js",
+    "./helpers/extends": [
+      {
+        "node": "./helpers/extends.js",
+        "import": "./helpers/esm/extends.js",
+        "default": "./helpers/extends.js"
+      },
+      "./helpers/extends.js"
+    ],
+    "./helpers/esm/extends": "./helpers/esm/extends.js",
+    "./helpers/objectSpread": [
+      {
+        "node": "./helpers/objectSpread.js",
+        "import": "./helpers/esm/objectSpread.js",
+        "default": "./helpers/objectSpread.js"
+      },
+      "./helpers/objectSpread.js"
+    ],
+    "./helpers/esm/objectSpread": "./helpers/esm/objectSpread.js",
+    "./helpers/inherits": [
+      {
+        "node": "./helpers/inherits.js",
+        "import": "./helpers/esm/inherits.js",
+        "default": "./helpers/inherits.js"
+      },
+      "./helpers/inherits.js"
+    ],
+    "./helpers/esm/inherits": "./helpers/esm/inherits.js",
+    "./helpers/inheritsLoose": [
+      {
+        "node": "./helpers/inheritsLoose.js",
+        "import": "./helpers/esm/inheritsLoose.js",
+        "default": "./helpers/inheritsLoose.js"
+      },
+      "./helpers/inheritsLoose.js"
+    ],
+    "./helpers/esm/inheritsLoose": "./helpers/esm/inheritsLoose.js",
+    "./helpers/getPrototypeOf": [
+      {
+        "node": "./helpers/getPrototypeOf.js",
+        "import": "./helpers/esm/getPrototypeOf.js",
+        "default": "./helpers/getPrototypeOf.js"
+      },
+      "./helpers/getPrototypeOf.js"
+    ],
+    "./helpers/esm/getPrototypeOf": "./helpers/esm/getPrototypeOf.js",
+    "./helpers/setPrototypeOf": [
+      {
+        "node": "./helpers/setPrototypeOf.js",
+        "import": "./helpers/esm/setPrototypeOf.js",
+        "default": "./helpers/setPrototypeOf.js"
+      },
+      "./helpers/setPrototypeOf.js"
+    ],
+    "./helpers/esm/setPrototypeOf": "./helpers/esm/setPrototypeOf.js",
+    "./helpers/isNativeReflectConstruct": [
+      {
+        "node": "./helpers/isNativeReflectConstruct.js",
+        "import": "./helpers/esm/isNativeReflectConstruct.js",
+        "default": "./helpers/isNativeReflectConstruct.js"
+      },
+      "./helpers/isNativeReflectConstruct.js"
+    ],
+    "./helpers/esm/isNativeReflectConstruct": "./helpers/esm/isNativeReflectConstruct.js",
+    "./helpers/construct": [
+      {
+        "node": "./helpers/construct.js",
+        "import": "./helpers/esm/construct.js",
+        "default": "./helpers/construct.js"
+      },
+      "./helpers/construct.js"
+    ],
+    "./helpers/esm/construct": "./helpers/esm/construct.js",
+    "./helpers/isNativeFunction": [
+      {
+        "node": "./helpers/isNativeFunction.js",
+        "import": "./helpers/esm/isNativeFunction.js",
+        "default": "./helpers/isNativeFunction.js"
+      },
+      "./helpers/isNativeFunction.js"
+    ],
+    "./helpers/esm/isNativeFunction": "./helpers/esm/isNativeFunction.js",
+    "./helpers/wrapNativeSuper": [
+      {
+        "node": "./helpers/wrapNativeSuper.js",
+        "import": "./helpers/esm/wrapNativeSuper.js",
+        "default": "./helpers/wrapNativeSuper.js"
+      },
+      "./helpers/wrapNativeSuper.js"
+    ],
+    "./helpers/esm/wrapNativeSuper": "./helpers/esm/wrapNativeSuper.js",
+    "./helpers/instanceof": [
+      {
+        "node": "./helpers/instanceof.js",
+        "import": "./helpers/esm/instanceof.js",
+        "default": "./helpers/instanceof.js"
+      },
+      "./helpers/instanceof.js"
+    ],
+    "./helpers/esm/instanceof": "./helpers/esm/instanceof.js",
+    "./helpers/interopRequireDefault": [
+      {
+        "node": "./helpers/interopRequireDefault.js",
+        "import": "./helpers/esm/interopRequireDefault.js",
+        "default": "./helpers/interopRequireDefault.js"
+      },
+      "./helpers/interopRequireDefault.js"
+    ],
+    "./helpers/esm/interopRequireDefault": "./helpers/esm/interopRequireDefault.js",
+    "./helpers/interopRequireWildcard": [
+      {
+        "node": "./helpers/interopRequireWildcard.js",
+        "import": "./helpers/esm/interopRequireWildcard.js",
+        "default": "./helpers/interopRequireWildcard.js"
+      },
+      "./helpers/interopRequireWildcard.js"
+    ],
+    "./helpers/esm/interopRequireWildcard": "./helpers/esm/interopRequireWildcard.js",
+    "./helpers/newArrowCheck": [
+      {
+        "node": "./helpers/newArrowCheck.js",
+        "import": "./helpers/esm/newArrowCheck.js",
+        "default": "./helpers/newArrowCheck.js"
+      },
+      "./helpers/newArrowCheck.js"
+    ],
+    "./helpers/esm/newArrowCheck": "./helpers/esm/newArrowCheck.js",
+    "./helpers/objectDestructuringEmpty": [
+      {
+        "node": "./helpers/objectDestructuringEmpty.js",
+        "import": "./helpers/esm/objectDestructuringEmpty.js",
+        "default": "./helpers/objectDestructuringEmpty.js"
+      },
+      "./helpers/objectDestructuringEmpty.js"
+    ],
+    "./helpers/esm/objectDestructuringEmpty": "./helpers/esm/objectDestructuringEmpty.js",
+    "./helpers/objectWithoutPropertiesLoose": [
+      {
+        "node": "./helpers/objectWithoutPropertiesLoose.js",
+        "import": "./helpers/esm/objectWithoutPropertiesLoose.js",
+        "default": "./helpers/objectWithoutPropertiesLoose.js"
+      },
+      "./helpers/objectWithoutPropertiesLoose.js"
+    ],
+    "./helpers/esm/objectWithoutPropertiesLoose": "./helpers/esm/objectWithoutPropertiesLoose.js",
+    "./helpers/objectWithoutProperties": [
+      {
+        "node": "./helpers/objectWithoutProperties.js",
+        "import": "./helpers/esm/objectWithoutProperties.js",
+        "default": "./helpers/objectWithoutProperties.js"
+      },
+      "./helpers/objectWithoutProperties.js"
+    ],
+    "./helpers/esm/objectWithoutProperties": "./helpers/esm/objectWithoutProperties.js",
+    "./helpers/assertThisInitialized": [
+      {
+        "node": "./helpers/assertThisInitialized.js",
+        "import": "./helpers/esm/assertThisInitialized.js",
+        "default": "./helpers/assertThisInitialized.js"
+      },
+      "./helpers/assertThisInitialized.js"
+    ],
+    "./helpers/esm/assertThisInitialized": "./helpers/esm/assertThisInitialized.js",
+    "./helpers/possibleConstructorReturn": [
+      {
+        "node": "./helpers/possibleConstructorReturn.js",
+        "import": "./helpers/esm/possibleConstructorReturn.js",
+        "default": "./helpers/possibleConstructorReturn.js"
+      },
+      "./helpers/possibleConstructorReturn.js"
+    ],
+    "./helpers/esm/possibleConstructorReturn": "./helpers/esm/possibleConstructorReturn.js",
+    "./helpers/createSuper": [
+      {
+        "node": "./helpers/createSuper.js",
+        "import": "./helpers/esm/createSuper.js",
+        "default": "./helpers/createSuper.js"
+      },
+      "./helpers/createSuper.js"
+    ],
+    "./helpers/esm/createSuper": "./helpers/esm/createSuper.js",
+    "./helpers/superPropBase": [
+      {
+        "node": "./helpers/superPropBase.js",
+        "import": "./helpers/esm/superPropBase.js",
+        "default": "./helpers/superPropBase.js"
+      },
+      "./helpers/superPropBase.js"
+    ],
+    "./helpers/esm/superPropBase": "./helpers/esm/superPropBase.js",
+    "./helpers/get": [
+      {
+        "node": "./helpers/get.js",
+        "import": "./helpers/esm/get.js",
+        "default": "./helpers/get.js"
+      },
+      "./helpers/get.js"
+    ],
+    "./helpers/esm/get": "./helpers/esm/get.js",
+    "./helpers/set": [
+      {
+        "node": "./helpers/set.js",
+        "import": "./helpers/esm/set.js",
+        "default": "./helpers/set.js"
+      },
+      "./helpers/set.js"
+    ],
+    "./helpers/esm/set": "./helpers/esm/set.js",
+    "./helpers/taggedTemplateLiteral": [
+      {
+        "node": "./helpers/taggedTemplateLiteral.js",
+        "import": "./helpers/esm/taggedTemplateLiteral.js",
+        "default": "./helpers/taggedTemplateLiteral.js"
+      },
+      "./helpers/taggedTemplateLiteral.js"
+    ],
+    "./helpers/esm/taggedTemplateLiteral": "./helpers/esm/taggedTemplateLiteral.js",
+    "./helpers/taggedTemplateLiteralLoose": [
+      {
+        "node": "./helpers/taggedTemplateLiteralLoose.js",
+        "import": "./helpers/esm/taggedTemplateLiteralLoose.js",
+        "default": "./helpers/taggedTemplateLiteralLoose.js"
+      },
+      "./helpers/taggedTemplateLiteralLoose.js"
+    ],
+    "./helpers/esm/taggedTemplateLiteralLoose": "./helpers/esm/taggedTemplateLiteralLoose.js",
+    "./helpers/readOnlyError": [
+      {
+        "node": "./helpers/readOnlyError.js",
+        "import": "./helpers/esm/readOnlyError.js",
+        "default": "./helpers/readOnlyError.js"
+      },
+      "./helpers/readOnlyError.js"
+    ],
+    "./helpers/esm/readOnlyError": "./helpers/esm/readOnlyError.js",
+    "./helpers/writeOnlyError": [
+      {
+        "node": "./helpers/writeOnlyError.js",
+        "import": "./helpers/esm/writeOnlyError.js",
+        "default": "./helpers/writeOnlyError.js"
+      },
+      "./helpers/writeOnlyError.js"
+    ],
+    "./helpers/esm/writeOnlyError": "./helpers/esm/writeOnlyError.js",
+    "./helpers/classNameTDZError": [
+      {
+        "node": "./helpers/classNameTDZError.js",
+        "import": "./helpers/esm/classNameTDZError.js",
+        "default": "./helpers/classNameTDZError.js"
+      },
+      "./helpers/classNameTDZError.js"
+    ],
+    "./helpers/esm/classNameTDZError": "./helpers/esm/classNameTDZError.js",
+    "./helpers/temporalUndefined": [
+      {
+        "node": "./helpers/temporalUndefined.js",
+        "import": "./helpers/esm/temporalUndefined.js",
+        "default": "./helpers/temporalUndefined.js"
+      },
+      "./helpers/temporalUndefined.js"
+    ],
+    "./helpers/esm/temporalUndefined": "./helpers/esm/temporalUndefined.js",
+    "./helpers/tdz": [
+      {
+        "node": "./helpers/tdz.js",
+        "import": "./helpers/esm/tdz.js",
+        "default": "./helpers/tdz.js"
+      },
+      "./helpers/tdz.js"
+    ],
+    "./helpers/esm/tdz": "./helpers/esm/tdz.js",
+    "./helpers/temporalRef": [
+      {
+        "node": "./helpers/temporalRef.js",
+        "import": "./helpers/esm/temporalRef.js",
+        "default": "./helpers/temporalRef.js"
+      },
+      "./helpers/temporalRef.js"
+    ],
+    "./helpers/esm/temporalRef": "./helpers/esm/temporalRef.js",
+    "./helpers/slicedToArray": [
+      {
+        "node": "./helpers/slicedToArray.js",
+        "import": "./helpers/esm/slicedToArray.js",
+        "default": "./helpers/slicedToArray.js"
+      },
+      "./helpers/slicedToArray.js"
+    ],
+    "./helpers/esm/slicedToArray": "./helpers/esm/slicedToArray.js",
+    "./helpers/slicedToArrayLoose": [
+      {
+        "node": "./helpers/slicedToArrayLoose.js",
+        "import": "./helpers/esm/slicedToArrayLoose.js",
+        "default": "./helpers/slicedToArrayLoose.js"
+      },
+      "./helpers/slicedToArrayLoose.js"
+    ],
+    "./helpers/esm/slicedToArrayLoose": "./helpers/esm/slicedToArrayLoose.js",
+    "./helpers/toArray": [
+      {
+        "node": "./helpers/toArray.js",
+        "import": "./helpers/esm/toArray.js",
+        "default": "./helpers/toArray.js"
+      },
+      "./helpers/toArray.js"
+    ],
+    "./helpers/esm/toArray": "./helpers/esm/toArray.js",
+    "./helpers/toConsumableArray": [
+      {
+        "node": "./helpers/toConsumableArray.js",
+        "import": "./helpers/esm/toConsumableArray.js",
+        "default": "./helpers/toConsumableArray.js"
+      },
+      "./helpers/toConsumableArray.js"
+    ],
+    "./helpers/esm/toConsumableArray": "./helpers/esm/toConsumableArray.js",
+    "./helpers/arrayWithoutHoles": [
+      {
+        "node": "./helpers/arrayWithoutHoles.js",
+        "import": "./helpers/esm/arrayWithoutHoles.js",
+        "default": "./helpers/arrayWithoutHoles.js"
+      },
+      "./helpers/arrayWithoutHoles.js"
+    ],
+    "./helpers/esm/arrayWithoutHoles": "./helpers/esm/arrayWithoutHoles.js",
+    "./helpers/arrayWithHoles": [
+      {
+        "node": "./helpers/arrayWithHoles.js",
+        "import": "./helpers/esm/arrayWithHoles.js",
+        "default": "./helpers/arrayWithHoles.js"
+      },
+      "./helpers/arrayWithHoles.js"
+    ],
+    "./helpers/esm/arrayWithHoles": "./helpers/esm/arrayWithHoles.js",
+    "./helpers/maybeArrayLike": [
+      {
+        "node": "./helpers/maybeArrayLike.js",
+        "import": "./helpers/esm/maybeArrayLike.js",
+        "default": "./helpers/maybeArrayLike.js"
+      },
+      "./helpers/maybeArrayLike.js"
+    ],
+    "./helpers/esm/maybeArrayLike": "./helpers/esm/maybeArrayLike.js",
+    "./helpers/iterableToArray": [
+      {
+        "node": "./helpers/iterableToArray.js",
+        "import": "./helpers/esm/iterableToArray.js",
+        "default": "./helpers/iterableToArray.js"
+      },
+      "./helpers/iterableToArray.js"
+    ],
+    "./helpers/esm/iterableToArray": "./helpers/esm/iterableToArray.js",
+    "./helpers/iterableToArrayLimit": [
+      {
+        "node": "./helpers/iterableToArrayLimit.js",
+        "import": "./helpers/esm/iterableToArrayLimit.js",
+        "default": "./helpers/iterableToArrayLimit.js"
+      },
+      "./helpers/iterableToArrayLimit.js"
+    ],
+    "./helpers/esm/iterableToArrayLimit": "./helpers/esm/iterableToArrayLimit.js",
+    "./helpers/iterableToArrayLimitLoose": [
+      {
+        "node": "./helpers/iterableToArrayLimitLoose.js",
+        "import": "./helpers/esm/iterableToArrayLimitLoose.js",
+        "default": "./helpers/iterableToArrayLimitLoose.js"
+      },
+      "./helpers/iterableToArrayLimitLoose.js"
+    ],
+    "./helpers/esm/iterableToArrayLimitLoose": "./helpers/esm/iterableToArrayLimitLoose.js",
+    "./helpers/unsupportedIterableToArray": [
+      {
+        "node": "./helpers/unsupportedIterableToArray.js",
+        "import": "./helpers/esm/unsupportedIterableToArray.js",
+        "default": "./helpers/unsupportedIterableToArray.js"
+      },
+      "./helpers/unsupportedIterableToArray.js"
+    ],
+    "./helpers/esm/unsupportedIterableToArray": "./helpers/esm/unsupportedIterableToArray.js",
+    "./helpers/arrayLikeToArray": [
+      {
+        "node": "./helpers/arrayLikeToArray.js",
+        "import": "./helpers/esm/arrayLikeToArray.js",
+        "default": "./helpers/arrayLikeToArray.js"
+      },
+      "./helpers/arrayLikeToArray.js"
+    ],
+    "./helpers/esm/arrayLikeToArray": "./helpers/esm/arrayLikeToArray.js",
+    "./helpers/nonIterableSpread": [
+      {
+        "node": "./helpers/nonIterableSpread.js",
+        "import": "./helpers/esm/nonIterableSpread.js",
+        "default": "./helpers/nonIterableSpread.js"
+      },
+      "./helpers/nonIterableSpread.js"
+    ],
+    "./helpers/esm/nonIterableSpread": "./helpers/esm/nonIterableSpread.js",
+    "./helpers/nonIterableRest": [
+      {
+        "node": "./helpers/nonIterableRest.js",
+        "import": "./helpers/esm/nonIterableRest.js",
+        "default": "./helpers/nonIterableRest.js"
+      },
+      "./helpers/nonIterableRest.js"
+    ],
+    "./helpers/esm/nonIterableRest": "./helpers/esm/nonIterableRest.js",
+    "./helpers/createForOfIteratorHelper": [
+      {
+        "node": "./helpers/createForOfIteratorHelper.js",
+        "import": "./helpers/esm/createForOfIteratorHelper.js",
+        "default": "./helpers/createForOfIteratorHelper.js"
+      },
+      "./helpers/createForOfIteratorHelper.js"
+    ],
+    "./helpers/esm/createForOfIteratorHelper": "./helpers/esm/createForOfIteratorHelper.js",
+    "./helpers/createForOfIteratorHelperLoose": [
+      {
+        "node": "./helpers/createForOfIteratorHelperLoose.js",
+        "import": "./helpers/esm/createForOfIteratorHelperLoose.js",
+        "default": "./helpers/createForOfIteratorHelperLoose.js"
+      },
+      "./helpers/createForOfIteratorHelperLoose.js"
+    ],
+    "./helpers/esm/createForOfIteratorHelperLoose": "./helpers/esm/createForOfIteratorHelperLoose.js",
+    "./helpers/skipFirstGeneratorNext": [
+      {
+        "node": "./helpers/skipFirstGeneratorNext.js",
+        "import": "./helpers/esm/skipFirstGeneratorNext.js",
+        "default": "./helpers/skipFirstGeneratorNext.js"
+      },
+      "./helpers/skipFirstGeneratorNext.js"
+    ],
+    "./helpers/esm/skipFirstGeneratorNext": "./helpers/esm/skipFirstGeneratorNext.js",
+    "./helpers/toPrimitive": [
+      {
+        "node": "./helpers/toPrimitive.js",
+        "import": "./helpers/esm/toPrimitive.js",
+        "default": "./helpers/toPrimitive.js"
+      },
+      "./helpers/toPrimitive.js"
+    ],
+    "./helpers/esm/toPrimitive": "./helpers/esm/toPrimitive.js",
+    "./helpers/toPropertyKey": [
+      {
+        "node": "./helpers/toPropertyKey.js",
+        "import": "./helpers/esm/toPropertyKey.js",
+        "default": "./helpers/toPropertyKey.js"
+      },
+      "./helpers/toPropertyKey.js"
+    ],
+    "./helpers/esm/toPropertyKey": "./helpers/esm/toPropertyKey.js",
+    "./helpers/initializerWarningHelper": [
+      {
+        "node": "./helpers/initializerWarningHelper.js",
+        "import": "./helpers/esm/initializerWarningHelper.js",
+        "default": "./helpers/initializerWarningHelper.js"
+      },
+      "./helpers/initializerWarningHelper.js"
+    ],
+    "./helpers/esm/initializerWarningHelper": "./helpers/esm/initializerWarningHelper.js",
+    "./helpers/initializerDefineProperty": [
+      {
+        "node": "./helpers/initializerDefineProperty.js",
+        "import": "./helpers/esm/initializerDefineProperty.js",
+        "default": "./helpers/initializerDefineProperty.js"
+      },
+      "./helpers/initializerDefineProperty.js"
+    ],
+    "./helpers/esm/initializerDefineProperty": "./helpers/esm/initializerDefineProperty.js",
+    "./helpers/applyDecoratedDescriptor": [
+      {
+        "node": "./helpers/applyDecoratedDescriptor.js",
+        "import": "./helpers/esm/applyDecoratedDescriptor.js",
+        "default": "./helpers/applyDecoratedDescriptor.js"
+      },
+      "./helpers/applyDecoratedDescriptor.js"
+    ],
+    "./helpers/esm/applyDecoratedDescriptor": "./helpers/esm/applyDecoratedDescriptor.js",
+    "./helpers/classPrivateFieldLooseKey": [
+      {
+        "node": "./helpers/classPrivateFieldLooseKey.js",
+        "import": "./helpers/esm/classPrivateFieldLooseKey.js",
+        "default": "./helpers/classPrivateFieldLooseKey.js"
+      },
+      "./helpers/classPrivateFieldLooseKey.js"
+    ],
+    "./helpers/esm/classPrivateFieldLooseKey": "./helpers/esm/classPrivateFieldLooseKey.js",
+    "./helpers/classPrivateFieldLooseBase": [
+      {
+        "node": "./helpers/classPrivateFieldLooseBase.js",
+        "import": "./helpers/esm/classPrivateFieldLooseBase.js",
+        "default": "./helpers/classPrivateFieldLooseBase.js"
+      },
+      "./helpers/classPrivateFieldLooseBase.js"
+    ],
+    "./helpers/esm/classPrivateFieldLooseBase": "./helpers/esm/classPrivateFieldLooseBase.js",
+    "./helpers/classPrivateFieldGet": [
+      {
+        "node": "./helpers/classPrivateFieldGet.js",
+        "import": "./helpers/esm/classPrivateFieldGet.js",
+        "default": "./helpers/classPrivateFieldGet.js"
+      },
+      "./helpers/classPrivateFieldGet.js"
+    ],
+    "./helpers/esm/classPrivateFieldGet": "./helpers/esm/classPrivateFieldGet.js",
+    "./helpers/classPrivateFieldSet": [
+      {
+        "node": "./helpers/classPrivateFieldSet.js",
+        "import": "./helpers/esm/classPrivateFieldSet.js",
+        "default": "./helpers/classPrivateFieldSet.js"
+      },
+      "./helpers/classPrivateFieldSet.js"
+    ],
+    "./helpers/esm/classPrivateFieldSet": "./helpers/esm/classPrivateFieldSet.js",
+    "./helpers/classPrivateFieldDestructureSet": [
+      {
+        "node": "./helpers/classPrivateFieldDestructureSet.js",
+        "import": "./helpers/esm/classPrivateFieldDestructureSet.js",
+        "default": "./helpers/classPrivateFieldDestructureSet.js"
+      },
+      "./helpers/classPrivateFieldDestructureSet.js"
+    ],
+    "./helpers/esm/classPrivateFieldDestructureSet": "./helpers/esm/classPrivateFieldDestructureSet.js",
+    "./helpers/classExtractFieldDescriptor": [
+      {
+        "node": "./helpers/classExtractFieldDescriptor.js",
+        "import": "./helpers/esm/classExtractFieldDescriptor.js",
+        "default": "./helpers/classExtractFieldDescriptor.js"
+      },
+      "./helpers/classExtractFieldDescriptor.js"
+    ],
+    "./helpers/esm/classExtractFieldDescriptor": "./helpers/esm/classExtractFieldDescriptor.js",
+    "./helpers/classStaticPrivateFieldSpecGet": [
+      {
+        "node": "./helpers/classStaticPrivateFieldSpecGet.js",
+        "import": "./helpers/esm/classStaticPrivateFieldSpecGet.js",
+        "default": "./helpers/classStaticPrivateFieldSpecGet.js"
+      },
+      "./helpers/classStaticPrivateFieldSpecGet.js"
+    ],
+    "./helpers/esm/classStaticPrivateFieldSpecGet": "./helpers/esm/classStaticPrivateFieldSpecGet.js",
+    "./helpers/classStaticPrivateFieldSpecSet": [
+      {
+        "node": "./helpers/classStaticPrivateFieldSpecSet.js",
+        "import": "./helpers/esm/classStaticPrivateFieldSpecSet.js",
+        "default": "./helpers/classStaticPrivateFieldSpecSet.js"
+      },
+      "./helpers/classStaticPrivateFieldSpecSet.js"
+    ],
+    "./helpers/esm/classStaticPrivateFieldSpecSet": "./helpers/esm/classStaticPrivateFieldSpecSet.js",
+    "./helpers/classStaticPrivateMethodGet": [
+      {
+        "node": "./helpers/classStaticPrivateMethodGet.js",
+        "import": "./helpers/esm/classStaticPrivateMethodGet.js",
+        "default": "./helpers/classStaticPrivateMethodGet.js"
+      },
+      "./helpers/classStaticPrivateMethodGet.js"
+    ],
+    "./helpers/esm/classStaticPrivateMethodGet": "./helpers/esm/classStaticPrivateMethodGet.js",
+    "./helpers/classStaticPrivateMethodSet": [
+      {
+        "node": "./helpers/classStaticPrivateMethodSet.js",
+        "import": "./helpers/esm/classStaticPrivateMethodSet.js",
+        "default": "./helpers/classStaticPrivateMethodSet.js"
+      },
+      "./helpers/classStaticPrivateMethodSet.js"
+    ],
+    "./helpers/esm/classStaticPrivateMethodSet": "./helpers/esm/classStaticPrivateMethodSet.js",
+    "./helpers/classApplyDescriptorGet": [
+      {
+        "node": "./helpers/classApplyDescriptorGet.js",
+        "import": "./helpers/esm/classApplyDescriptorGet.js",
+        "default": "./helpers/classApplyDescriptorGet.js"
+      },
+      "./helpers/classApplyDescriptorGet.js"
+    ],
+    "./helpers/esm/classApplyDescriptorGet": "./helpers/esm/classApplyDescriptorGet.js",
+    "./helpers/classApplyDescriptorSet": [
+      {
+        "node": "./helpers/classApplyDescriptorSet.js",
+        "import": "./helpers/esm/classApplyDescriptorSet.js",
+        "default": "./helpers/classApplyDescriptorSet.js"
+      },
+      "./helpers/classApplyDescriptorSet.js"
+    ],
+    "./helpers/esm/classApplyDescriptorSet": "./helpers/esm/classApplyDescriptorSet.js",
+    "./helpers/classApplyDescriptorDestructureSet": [
+      {
+        "node": "./helpers/classApplyDescriptorDestructureSet.js",
+        "import": "./helpers/esm/classApplyDescriptorDestructureSet.js",
+        "default": "./helpers/classApplyDescriptorDestructureSet.js"
+      },
+      "./helpers/classApplyDescriptorDestructureSet.js"
+    ],
+    "./helpers/esm/classApplyDescriptorDestructureSet": "./helpers/esm/classApplyDescriptorDestructureSet.js",
+    "./helpers/classStaticPrivateFieldDestructureSet": [
+      {
+        "node": "./helpers/classStaticPrivateFieldDestructureSet.js",
+        "import": "./helpers/esm/classStaticPrivateFieldDestructureSet.js",
+        "default": "./helpers/classStaticPrivateFieldDestructureSet.js"
+      },
+      "./helpers/classStaticPrivateFieldDestructureSet.js"
+    ],
+    "./helpers/esm/classStaticPrivateFieldDestructureSet": "./helpers/esm/classStaticPrivateFieldDestructureSet.js",
+    "./helpers/classCheckPrivateStaticAccess": [
+      {
+        "node": "./helpers/classCheckPrivateStaticAccess.js",
+        "import": "./helpers/esm/classCheckPrivateStaticAccess.js",
+        "default": "./helpers/classCheckPrivateStaticAccess.js"
+      },
+      "./helpers/classCheckPrivateStaticAccess.js"
+    ],
+    "./helpers/esm/classCheckPrivateStaticAccess": "./helpers/esm/classCheckPrivateStaticAccess.js",
+    "./helpers/classCheckPrivateStaticFieldDescriptor": [
+      {
+        "node": "./helpers/classCheckPrivateStaticFieldDescriptor.js",
+        "import": "./helpers/esm/classCheckPrivateStaticFieldDescriptor.js",
+        "default": "./helpers/classCheckPrivateStaticFieldDescriptor.js"
+      },
+      "./helpers/classCheckPrivateStaticFieldDescriptor.js"
+    ],
+    "./helpers/esm/classCheckPrivateStaticFieldDescriptor": "./helpers/esm/classCheckPrivateStaticFieldDescriptor.js",
+    "./helpers/decorate": [
+      {
+        "node": "./helpers/decorate.js",
+        "import": "./helpers/esm/decorate.js",
+        "default": "./helpers/decorate.js"
+      },
+      "./helpers/decorate.js"
+    ],
+    "./helpers/esm/decorate": "./helpers/esm/decorate.js",
+    "./helpers/classPrivateMethodGet": [
+      {
+        "node": "./helpers/classPrivateMethodGet.js",
+        "import": "./helpers/esm/classPrivateMethodGet.js",
+        "default": "./helpers/classPrivateMethodGet.js"
+      },
+      "./helpers/classPrivateMethodGet.js"
+    ],
+    "./helpers/esm/classPrivateMethodGet": "./helpers/esm/classPrivateMethodGet.js",
+    "./helpers/classPrivateMethodSet": [
+      {
+        "node": "./helpers/classPrivateMethodSet.js",
+        "import": "./helpers/esm/classPrivateMethodSet.js",
+        "default": "./helpers/classPrivateMethodSet.js"
+      },
+      "./helpers/classPrivateMethodSet.js"
+    ],
+    "./helpers/esm/classPrivateMethodSet": "./helpers/esm/classPrivateMethodSet.js",
+    "./package": "./package.json",
+    "./package.json": "./package.json",
+    "./regenerator": "./regenerator/index.js",
+    "./regenerator/*.js": "./regenerator/*.js",
+    "./regenerator/": "./regenerator/"
+  },
+  "engines": {
+    "node": ">=6.9.0"
+  }
+}
diff --git a/packages/sandpack-core/src/resolver/fixture/node_modules/styled-components/dist/macro.js b/packages/sandpack-core/src/resolver/fixture/node_modules/styled-components/dist/macro.js
new file mode 100644
index 00000000000..e69de29bb2d
diff --git a/packages/sandpack-core/src/resolver/fixture/node_modules/styled-components/macro/package.json b/packages/sandpack-core/src/resolver/fixture/node_modules/styled-components/macro/package.json
new file mode 100644
index 00000000000..406f922379a
--- /dev/null
+++ b/packages/sandpack-core/src/resolver/fixture/node_modules/styled-components/macro/package.json
@@ -0,0 +1,3 @@
+{
+  "main": "../dist/macro.js"
+}
diff --git a/packages/sandpack-core/src/resolver/fixture/node_modules/styled-components/package.json b/packages/sandpack-core/src/resolver/fixture/node_modules/styled-components/package.json
new file mode 100644
index 00000000000..0967ef424bc
--- /dev/null
+++ b/packages/sandpack-core/src/resolver/fixture/node_modules/styled-components/package.json
@@ -0,0 +1,1 @@
+{}
diff --git a/packages/sandpack-core/src/resolver/resolver.ts b/packages/sandpack-core/src/resolver/resolver.ts
index bae6d861717..5ff6f8d9301 100644
--- a/packages/sandpack-core/src/resolver/resolver.ts
+++ b/packages/sandpack-core/src/resolver/resolver.ts
@@ -1,13 +1,15 @@
+/* eslint-disable no-else-return */
 /* eslint-disable no-continue */
 import gensync, { Gensync } from 'gensync';
 import micromatch from 'micromatch';
 
 import * as pathUtils from '@codesandbox/common/lib/utils/path';
+import { ModuleNotFoundError } from './errors/ModuleNotFound';
 
 const EMPTY_SHIM = '//empty.js';
 
 // alias/exports/main keys, sorted from high to low priority
-const EXPORTS_KEYS = ['browser', 'development', 'default'];
+const EXPORTS_KEYS = ['browser', 'development', 'default', 'require', 'import'];
 const MAIN_PKG_FIELDS = ['module', 'browser', 'main', 'jsnext:main'];
 const PKG_ALIAS_FIELDS = ['browser', 'alias'];
 
@@ -16,7 +18,7 @@ export type PackageCache = Map<string, any>;
 export type FnIsFile = Gensync<(filepath: string) => boolean>;
 export type FnReadFile = Gensync<(filepath: string) => string>;
 
-interface IResolveOptionsInput {
+export interface IResolveOptionsInput {
   filename: string;
   extensions: string[];
   isFile: FnIsFile;
@@ -30,6 +32,24 @@ interface IResolveOptions extends IResolveOptionsInput {
   packageCache: PackageCache;
 }
 
+export function getParentDirectories(
+  filepath: string,
+  rootDir: string = '/'
+): string[] {
+  const parts = filepath.split('/');
+  const directories = [];
+  while (parts.length > 0) {
+    const directory = parts.join('/') || '/';
+    // Test /foo vs /foo-something - /foo-something is not in rootDir
+    if (directory.length < rootDir.length || !directory.startsWith(rootDir)) {
+      break;
+    }
+    directories.push(directory);
+    parts.pop();
+  }
+  return directories;
+}
+
 function normalizeAliasFilePath(
   specifier: string,
   pkgRoot: string,
@@ -72,24 +92,47 @@ function normalizePackageExport(filepath: string, pkgRoot: string): string {
   return normalizeAliasFilePath(filepath.replace(/\*/g, '$1'), pkgRoot);
 }
 
-function processPackageExportsObject(
-  exports: {
-    [key: string]: string | null | false;
-  },
+type PackageExportObj = {
+  [key: string]: string | null | false;
+};
+
+type PackageExportArr = Array<PackageExportObj | string>;
+
+type PackageExportType = string | null | PackageExportObj | PackageExportArr;
+
+function extractPathFromExport(
+  exportValue: PackageExportType,
   pkgRoot: string
 ): string | false {
-  for (const key of EXPORTS_KEYS) {
-    const exportFilename = exports[key];
-    if (exportFilename !== undefined) {
-      return typeof exportFilename === 'string'
-        ? normalizePackageExport(exportFilename, pkgRoot)
-        : false;
+  if (!exportValue) {
+    return false;
+  } else if (typeof exportValue === 'string') {
+    return normalizePackageExport(exportValue, pkgRoot);
+  } else if (Array.isArray(exportValue)) {
+    const foundPaths = exportValue
+      .map(v => extractPathFromExport(v, pkgRoot))
+      .filter(Boolean);
+    if (!foundPaths.length) {
+      return false;
+    } else {
+      return foundPaths[0];
     }
+  } else if (typeof exportValue === 'object') {
+    for (const key of EXPORTS_KEYS) {
+      const exportFilename = exportValue[key];
+      if (exportFilename !== undefined) {
+        return typeof exportFilename === 'string'
+          ? normalizePackageExport(exportFilename, pkgRoot)
+          : false;
+      }
+    }
+    return false;
+  } else {
+    throw new Error(`Unsupported export type ${typeof exportValue}`);
   }
-  return false;
 }
 
-function processPackageJSON(
+export function _processPackageJSON(
   content: any,
   pkgRoot: string
 ): ProcessedPackageJSON {
@@ -127,16 +170,12 @@ function processPackageJSON(
       aliases[pkgRoot] = normalizeAliasFilePath(content.exports, pkgRoot);
     } else if (typeof content.exports === 'object') {
       for (const exportKey of Object.keys(content.exports)) {
-        const exportValue = content.exports[exportKey];
+        const exportValue = extractPathFromExport(
+          content.exports[exportKey],
+          pkgRoot
+        );
         const normalizedKey = normalizeAliasFilePath(exportKey, pkgRoot);
-        if (typeof exportValue === 'string') {
-          aliases[normalizedKey] = normalizePackageExport(exportValue, pkgRoot);
-        } else if (!exportValue) {
-          aliases[normalizedKey] = EMPTY_SHIM;
-        } else if (typeof exportValue === 'object') {
-          aliases[normalizedKey] =
-            processPackageExportsObject(exportValue, pkgRoot) || EMPTY_SHIM;
-        }
+        aliases[normalizedKey] = exportValue || EMPTY_SHIM;
       }
     }
   }
@@ -151,15 +190,16 @@ interface IFoundPackageJSON {
 
 function* loadPackageJSON(
   filepath: string,
-  opts: IResolveOptions
+  opts: IResolveOptions,
+  rootDir: string = '/'
 ): Generator<any, IFoundPackageJSON | null, any> {
-  const parts = filepath.split('/');
-  while (parts.length > 0) {
-    const packageFilePath = parts.join('/') + '/package.json';
+  const directories = getParentDirectories(filepath, rootDir);
+  for (const directory of directories) {
+    const packageFilePath = pathUtils.join(directory, 'package.json');
     let packageContent = opts.packageCache.get(packageFilePath);
-    if (!opts.packageCache.has(packageFilePath)) {
+    if (packageContent === undefined) {
       try {
-        packageContent = processPackageJSON(
+        packageContent = _processPackageJSON(
           JSON.parse(yield* opts.readFile(packageFilePath)),
           pathUtils.dirname(packageFilePath)
         );
@@ -174,7 +214,6 @@ function* loadPackageJSON(
         content: packageContent,
       };
     }
-    parts.pop();
   }
   return null;
 }
@@ -186,6 +225,7 @@ function resolveFile(filepath: string, dir: string): string {
     case '/':
       return filepath;
     default:
+      // is a node module
       return filepath;
   }
 }
@@ -211,11 +251,14 @@ function loadAlias(pkgJson: IFoundPackageJSON, filename: string): string {
       continue;
     }
 
-    const matchers = Object.keys(aliases).filter(a => a.includes('*'));
-    for (const matcher of matchers) {
-      const re = micromatch.makeRe(matcher, { capture: true });
+    for (const aliasKey of Object.keys(aliases)) {
+      if (!aliasKey.includes('*')) {
+        continue;
+      }
+
+      const re = micromatch.makeRe(aliasKey, { capture: true });
       if (re.test(relativeFilepath)) {
-        const val = aliases[matcher];
+        const val = aliases[aliasKey];
         aliasedPath = relativeFilepath.replace(re, val);
         break;
       }
@@ -257,39 +300,35 @@ function* resolveNodeModule(
   opts: IResolveOptions
 ): Generator<any, string, any> {
   const pkgSpecifierParts = extractPkgSpecifierParts(moduleSpecifier);
+  const directories = getParentDirectories(opts.filename);
   for (const modulesPath of opts.moduleDirectories) {
-    const parts = opts.filename.split('/');
-    while (parts.length > 0) {
-      const packageJsonPath = [
-        ...parts,
+    for (const directory of directories) {
+      const rootDir = pathUtils.join(
+        directory,
         modulesPath,
-        pkgSpecifierParts.pkgName,
-        'package.json',
-      ].join('/');
-      const pkgExists = yield* isFile(packageJsonPath, opts.isFile);
-      if (pkgExists) {
+        pkgSpecifierParts.pkgName
+      );
+      const pkgFilePath = pathUtils.join(rootDir, pkgSpecifierParts.filepath);
+      const pkgJson = yield* loadPackageJSON(pkgFilePath, opts, rootDir);
+      if (pkgJson) {
         try {
-          const filepath = pkgSpecifierParts.filepath
-            ? './' + pkgSpecifierParts.filepath
-            : '.';
-          return yield* resolverRunner(filepath, {
+          return yield* resolver(pkgFilePath, {
             ...opts,
-            filename: packageJsonPath,
+            filename: pkgJson.filepath,
           });
         } catch (err) {
           if (!pkgSpecifierParts.filepath) {
-            return yield* resolverRunner('./index', {
+            return yield* resolver(pathUtils.join(pkgFilePath, 'index'), {
               ...opts,
-              filename: packageJsonPath,
+              filename: pkgJson.filepath,
             });
           }
           throw err;
         }
       }
-      parts.pop();
     }
   }
-  throw new Error(`Could not find module ${moduleSpecifier}`);
+  throw new ModuleNotFoundError(moduleSpecifier, opts.filename);
 }
 
 function* findPackageJSON(
@@ -362,7 +401,7 @@ export function normalizeModuleSpecifier(specifier: string): string {
   return normalized;
 }
 
-const resolverRunner = gensync<
+export const resolver = gensync<
   (moduleSpecifier: string, inputOpts: IResolveOptionsInput) => string
 >(function* resolve(moduleSpecifier, inputOpts): Generator<any, string, any> {
   const normalizedSpecifier = normalizeModuleSpecifier(moduleSpecifier);
@@ -373,9 +412,7 @@ const resolverRunner = gensync<
     try {
       return yield* resolveNodeModule(modulePath, opts);
     } catch (e) {
-      throw new Error(
-        `Could not find ${normalizedSpecifier} in ${opts.filename}`
-      );
+      throw new ModuleNotFoundError(normalizedSpecifier, opts.filename);
     }
   }
 
@@ -385,11 +422,11 @@ const resolverRunner = gensync<
   }
 
   if (!foundFile) {
-    throw new Error(`Cannot find module ${modulePath}`);
+    throw new ModuleNotFoundError(modulePath, opts.filename);
   }
 
   return foundFile;
 });
 
-export const resolveSync = resolverRunner.sync;
-export const resolveAsync = resolverRunner.async;
+export const resolveSync = resolver.sync;
+export const resolveAsync = resolver.async;
diff --git a/packages/sandpack-core/src/types/browser-resolve.d.ts b/packages/sandpack-core/src/types/browser-resolve.d.ts
deleted file mode 100644
index e1739fa2eb1..00000000000
--- a/packages/sandpack-core/src/types/browser-resolve.d.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-declare module 'browser-resolve' {
-  import resolve from 'resolve';
-  export default resolve;
-}
diff --git a/packages/sandpack-core/src/utils/resolve-utils.ts b/packages/sandpack-core/src/utils/resolve-utils.ts
deleted file mode 100644
index 3d526a25443..00000000000
--- a/packages/sandpack-core/src/utils/resolve-utils.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { PackageJSON } from '@codesandbox/common/lib/types';
-
-export const packageFilter = (p: PackageJSON) => {
-  if (p.module) {
-    p.main = p.module;
-  }
-
-  return p;
-};
diff --git a/yarn.lock b/yarn.lock
index 714aec235b5..3c0804fee98 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8785,7 +8785,7 @@ browser-process-hrtime@^1.0.0:
   resolved "https://registry.yarnpkg.com/browser-process-hrtime/-/browser-process-hrtime-1.0.0.tgz#3c9b4b7d782c8121e56f10106d84c0d0ffc94626"
   integrity sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow==
 
-browser-resolve@CompuIves/node-browser-resolve, browser-resolve@^1.11.3:
+browser-resolve@^1.11.3:
   version "1.11.5"
   resolved "https://codeload.github.com/CompuIves/node-browser-resolve/tar.gz/0da48af3db28326db85de9aece5c72b9477da5f3"
   dependencies:


Test patch:
diff --git a/packages/sandpack-core/src/resolver/__snapshots__/resolver.test.ts.snap b/packages/sandpack-core/src/resolver/__snapshots__/resolver.test.ts.snap
new file mode 100644
index 00000000000..df934a90439
--- /dev/null
+++ b/packages/sandpack-core/src/resolver/__snapshots__/resolver.test.ts.snap
@@ -0,0 +1,189 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`process package.json Should correctly process pkg.exports from @babel/runtime 1`] = `
+Object {
+  "aliases": Object {
+    "/node_modules/@babel/runtime/helpers/AsyncGenerator": "/node_modules/@babel/runtime/helpers/AsyncGenerator.js",
+    "/node_modules/@babel/runtime/helpers/AwaitValue": "/node_modules/@babel/runtime/helpers/AwaitValue.js",
+    "/node_modules/@babel/runtime/helpers/applyDecoratedDescriptor": "/node_modules/@babel/runtime/helpers/applyDecoratedDescriptor.js",
+    "/node_modules/@babel/runtime/helpers/arrayLikeToArray": "/node_modules/@babel/runtime/helpers/arrayLikeToArray.js",
+    "/node_modules/@babel/runtime/helpers/arrayWithHoles": "/node_modules/@babel/runtime/helpers/arrayWithHoles.js",
+    "/node_modules/@babel/runtime/helpers/arrayWithoutHoles": "/node_modules/@babel/runtime/helpers/arrayWithoutHoles.js",
+    "/node_modules/@babel/runtime/helpers/assertThisInitialized": "/node_modules/@babel/runtime/helpers/assertThisInitialized.js",
+    "/node_modules/@babel/runtime/helpers/asyncGeneratorDelegate": "/node_modules/@babel/runtime/helpers/asyncGeneratorDelegate.js",
+    "/node_modules/@babel/runtime/helpers/asyncIterator": "/node_modules/@babel/runtime/helpers/asyncIterator.js",
+    "/node_modules/@babel/runtime/helpers/asyncToGenerator": "/node_modules/@babel/runtime/helpers/asyncToGenerator.js",
+    "/node_modules/@babel/runtime/helpers/awaitAsyncGenerator": "/node_modules/@babel/runtime/helpers/awaitAsyncGenerator.js",
+    "/node_modules/@babel/runtime/helpers/classApplyDescriptorDestructureSet": "/node_modules/@babel/runtime/helpers/classApplyDescriptorDestructureSet.js",
+    "/node_modules/@babel/runtime/helpers/classApplyDescriptorGet": "/node_modules/@babel/runtime/helpers/classApplyDescriptorGet.js",
+    "/node_modules/@babel/runtime/helpers/classApplyDescriptorSet": "/node_modules/@babel/runtime/helpers/classApplyDescriptorSet.js",
+    "/node_modules/@babel/runtime/helpers/classCallCheck": "/node_modules/@babel/runtime/helpers/classCallCheck.js",
+    "/node_modules/@babel/runtime/helpers/classCheckPrivateStaticAccess": "/node_modules/@babel/runtime/helpers/classCheckPrivateStaticAccess.js",
+    "/node_modules/@babel/runtime/helpers/classCheckPrivateStaticFieldDescriptor": "/node_modules/@babel/runtime/helpers/classCheckPrivateStaticFieldDescriptor.js",
+    "/node_modules/@babel/runtime/helpers/classExtractFieldDescriptor": "/node_modules/@babel/runtime/helpers/classExtractFieldDescriptor.js",
+    "/node_modules/@babel/runtime/helpers/classNameTDZError": "/node_modules/@babel/runtime/helpers/classNameTDZError.js",
+    "/node_modules/@babel/runtime/helpers/classPrivateFieldDestructureSet": "/node_modules/@babel/runtime/helpers/classPrivateFieldDestructureSet.js",
+    "/node_modules/@babel/runtime/helpers/classPrivateFieldGet": "/node_modules/@babel/runtime/helpers/classPrivateFieldGet.js",
+    "/node_modules/@babel/runtime/helpers/classPrivateFieldLooseBase": "/node_modules/@babel/runtime/helpers/classPrivateFieldLooseBase.js",
+    "/node_modules/@babel/runtime/helpers/classPrivateFieldLooseKey": "/node_modules/@babel/runtime/helpers/classPrivateFieldLooseKey.js",
+    "/node_modules/@babel/runtime/helpers/classPrivateFieldSet": "/node_modules/@babel/runtime/helpers/classPrivateFieldSet.js",
+    "/node_modules/@babel/runtime/helpers/classPrivateMethodGet": "/node_modules/@babel/runtime/helpers/classPrivateMethodGet.js",
+    "/node_modules/@babel/runtime/helpers/classPrivateMethodSet": "/node_modules/@babel/runtime/helpers/classPrivateMethodSet.js",
+    "/node_modules/@babel/runtime/helpers/classStaticPrivateFieldDestructureSet": "/node_modules/@babel/runtime/helpers/classStaticPrivateFieldDestructureSet.js",
+    "/node_modules/@babel/runtime/helpers/classStaticPrivateFieldSpecGet": "/node_modules/@babel/runtime/helpers/classStaticPrivateFieldSpecGet.js",
+    "/node_modules/@babel/runtime/helpers/classStaticPrivateFieldSpecSet": "/node_modules/@babel/runtime/helpers/classStaticPrivateFieldSpecSet.js",
+    "/node_modules/@babel/runtime/helpers/classStaticPrivateMethodGet": "/node_modules/@babel/runtime/helpers/classStaticPrivateMethodGet.js",
+    "/node_modules/@babel/runtime/helpers/classStaticPrivateMethodSet": "/node_modules/@babel/runtime/helpers/classStaticPrivateMethodSet.js",
+    "/node_modules/@babel/runtime/helpers/construct": "/node_modules/@babel/runtime/helpers/construct.js",
+    "/node_modules/@babel/runtime/helpers/createClass": "/node_modules/@babel/runtime/helpers/createClass.js",
+    "/node_modules/@babel/runtime/helpers/createForOfIteratorHelper": "/node_modules/@babel/runtime/helpers/createForOfIteratorHelper.js",
+    "/node_modules/@babel/runtime/helpers/createForOfIteratorHelperLoose": "/node_modules/@babel/runtime/helpers/createForOfIteratorHelperLoose.js",
+    "/node_modules/@babel/runtime/helpers/createSuper": "/node_modules/@babel/runtime/helpers/createSuper.js",
+    "/node_modules/@babel/runtime/helpers/decorate": "/node_modules/@babel/runtime/helpers/decorate.js",
+    "/node_modules/@babel/runtime/helpers/defaults": "/node_modules/@babel/runtime/helpers/defaults.js",
+    "/node_modules/@babel/runtime/helpers/defineEnumerableProperties": "/node_modules/@babel/runtime/helpers/defineEnumerableProperties.js",
+    "/node_modules/@babel/runtime/helpers/defineProperty": "/node_modules/@babel/runtime/helpers/defineProperty.js",
+    "/node_modules/@babel/runtime/helpers/esm/AsyncGenerator": "/node_modules/@babel/runtime/helpers/esm/AsyncGenerator.js",
+    "/node_modules/@babel/runtime/helpers/esm/AwaitValue": "/node_modules/@babel/runtime/helpers/esm/AwaitValue.js",
+    "/node_modules/@babel/runtime/helpers/esm/applyDecoratedDescriptor": "/node_modules/@babel/runtime/helpers/esm/applyDecoratedDescriptor.js",
+    "/node_modules/@babel/runtime/helpers/esm/arrayLikeToArray": "/node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js",
+    "/node_modules/@babel/runtime/helpers/esm/arrayWithHoles": "/node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js",
+    "/node_modules/@babel/runtime/helpers/esm/arrayWithoutHoles": "/node_modules/@babel/runtime/helpers/esm/arrayWithoutHoles.js",
+    "/node_modules/@babel/runtime/helpers/esm/assertThisInitialized": "/node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js",
+    "/node_modules/@babel/runtime/helpers/esm/asyncGeneratorDelegate": "/node_modules/@babel/runtime/helpers/esm/asyncGeneratorDelegate.js",
+    "/node_modules/@babel/runtime/helpers/esm/asyncIterator": "/node_modules/@babel/runtime/helpers/esm/asyncIterator.js",
+    "/node_modules/@babel/runtime/helpers/esm/asyncToGenerator": "/node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js",
+    "/node_modules/@babel/runtime/helpers/esm/awaitAsyncGenerator": "/node_modules/@babel/runtime/helpers/esm/awaitAsyncGenerator.js",
+    "/node_modules/@babel/runtime/helpers/esm/classApplyDescriptorDestructureSet": "/node_modules/@babel/runtime/helpers/esm/classApplyDescriptorDestructureSet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classApplyDescriptorGet": "/node_modules/@babel/runtime/helpers/esm/classApplyDescriptorGet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classApplyDescriptorSet": "/node_modules/@babel/runtime/helpers/esm/classApplyDescriptorSet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classCallCheck": "/node_modules/@babel/runtime/helpers/esm/classCallCheck.js",
+    "/node_modules/@babel/runtime/helpers/esm/classCheckPrivateStaticAccess": "/node_modules/@babel/runtime/helpers/esm/classCheckPrivateStaticAccess.js",
+    "/node_modules/@babel/runtime/helpers/esm/classCheckPrivateStaticFieldDescriptor": "/node_modules/@babel/runtime/helpers/esm/classCheckPrivateStaticFieldDescriptor.js",
+    "/node_modules/@babel/runtime/helpers/esm/classExtractFieldDescriptor": "/node_modules/@babel/runtime/helpers/esm/classExtractFieldDescriptor.js",
+    "/node_modules/@babel/runtime/helpers/esm/classNameTDZError": "/node_modules/@babel/runtime/helpers/esm/classNameTDZError.js",
+    "/node_modules/@babel/runtime/helpers/esm/classPrivateFieldDestructureSet": "/node_modules/@babel/runtime/helpers/esm/classPrivateFieldDestructureSet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classPrivateFieldGet": "/node_modules/@babel/runtime/helpers/esm/classPrivateFieldGet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classPrivateFieldLooseBase": "/node_modules/@babel/runtime/helpers/esm/classPrivateFieldLooseBase.js",
+    "/node_modules/@babel/runtime/helpers/esm/classPrivateFieldLooseKey": "/node_modules/@babel/runtime/helpers/esm/classPrivateFieldLooseKey.js",
+    "/node_modules/@babel/runtime/helpers/esm/classPrivateFieldSet": "/node_modules/@babel/runtime/helpers/esm/classPrivateFieldSet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classPrivateMethodGet": "/node_modules/@babel/runtime/helpers/esm/classPrivateMethodGet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classPrivateMethodSet": "/node_modules/@babel/runtime/helpers/esm/classPrivateMethodSet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classStaticPrivateFieldDestructureSet": "/node_modules/@babel/runtime/helpers/esm/classStaticPrivateFieldDestructureSet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classStaticPrivateFieldSpecGet": "/node_modules/@babel/runtime/helpers/esm/classStaticPrivateFieldSpecGet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classStaticPrivateFieldSpecSet": "/node_modules/@babel/runtime/helpers/esm/classStaticPrivateFieldSpecSet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classStaticPrivateMethodGet": "/node_modules/@babel/runtime/helpers/esm/classStaticPrivateMethodGet.js",
+    "/node_modules/@babel/runtime/helpers/esm/classStaticPrivateMethodSet": "/node_modules/@babel/runtime/helpers/esm/classStaticPrivateMethodSet.js",
+    "/node_modules/@babel/runtime/helpers/esm/construct": "/node_modules/@babel/runtime/helpers/esm/construct.js",
+    "/node_modules/@babel/runtime/helpers/esm/createClass": "/node_modules/@babel/runtime/helpers/esm/createClass.js",
+    "/node_modules/@babel/runtime/helpers/esm/createForOfIteratorHelper": "/node_modules/@babel/runtime/helpers/esm/createForOfIteratorHelper.js",
+    "/node_modules/@babel/runtime/helpers/esm/createForOfIteratorHelperLoose": "/node_modules/@babel/runtime/helpers/esm/createForOfIteratorHelperLoose.js",
+    "/node_modules/@babel/runtime/helpers/esm/createSuper": "/node_modules/@babel/runtime/helpers/esm/createSuper.js",
+    "/node_modules/@babel/runtime/helpers/esm/decorate": "/node_modules/@babel/runtime/helpers/esm/decorate.js",
+    "/node_modules/@babel/runtime/helpers/esm/defaults": "/node_modules/@babel/runtime/helpers/esm/defaults.js",
+    "/node_modules/@babel/runtime/helpers/esm/defineEnumerableProperties": "/node_modules/@babel/runtime/helpers/esm/defineEnumerableProperties.js",
+    "/node_modules/@babel/runtime/helpers/esm/defineProperty": "/node_modules/@babel/runtime/helpers/esm/defineProperty.js",
+    "/node_modules/@babel/runtime/helpers/esm/extends": "/node_modules/@babel/runtime/helpers/esm/extends.js",
+    "/node_modules/@babel/runtime/helpers/esm/get": "/node_modules/@babel/runtime/helpers/esm/get.js",
+    "/node_modules/@babel/runtime/helpers/esm/getPrototypeOf": "/node_modules/@babel/runtime/helpers/esm/getPrototypeOf.js",
+    "/node_modules/@babel/runtime/helpers/esm/inherits": "/node_modules/@babel/runtime/helpers/esm/inherits.js",
+    "/node_modules/@babel/runtime/helpers/esm/inheritsLoose": "/node_modules/@babel/runtime/helpers/esm/inheritsLoose.js",
+    "/node_modules/@babel/runtime/helpers/esm/initializerDefineProperty": "/node_modules/@babel/runtime/helpers/esm/initializerDefineProperty.js",
+    "/node_modules/@babel/runtime/helpers/esm/initializerWarningHelper": "/node_modules/@babel/runtime/helpers/esm/initializerWarningHelper.js",
+    "/node_modules/@babel/runtime/helpers/esm/instanceof": "/node_modules/@babel/runtime/helpers/esm/instanceof.js",
+    "/node_modules/@babel/runtime/helpers/esm/interopRequireDefault": "/node_modules/@babel/runtime/helpers/esm/interopRequireDefault.js",
+    "/node_modules/@babel/runtime/helpers/esm/interopRequireWildcard": "/node_modules/@babel/runtime/helpers/esm/interopRequireWildcard.js",
+    "/node_modules/@babel/runtime/helpers/esm/isNativeFunction": "/node_modules/@babel/runtime/helpers/esm/isNativeFunction.js",
+    "/node_modules/@babel/runtime/helpers/esm/isNativeReflectConstruct": "/node_modules/@babel/runtime/helpers/esm/isNativeReflectConstruct.js",
+    "/node_modules/@babel/runtime/helpers/esm/iterableToArray": "/node_modules/@babel/runtime/helpers/esm/iterableToArray.js",
+    "/node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit": "/node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js",
+    "/node_modules/@babel/runtime/helpers/esm/iterableToArrayLimitLoose": "/node_modules/@babel/runtime/helpers/esm/iterableToArrayLimitLoose.js",
+    "/node_modules/@babel/runtime/helpers/esm/jsx": "/node_modules/@babel/runtime/helpers/esm/jsx.js",
+    "/node_modules/@babel/runtime/helpers/esm/maybeArrayLike": "/node_modules/@babel/runtime/helpers/esm/maybeArrayLike.js",
+    "/node_modules/@babel/runtime/helpers/esm/newArrowCheck": "/node_modules/@babel/runtime/helpers/esm/newArrowCheck.js",
+    "/node_modules/@babel/runtime/helpers/esm/nonIterableRest": "/node_modules/@babel/runtime/helpers/esm/nonIterableRest.js",
+    "/node_modules/@babel/runtime/helpers/esm/nonIterableSpread": "/node_modules/@babel/runtime/helpers/esm/nonIterableSpread.js",
+    "/node_modules/@babel/runtime/helpers/esm/objectDestructuringEmpty": "/node_modules/@babel/runtime/helpers/esm/objectDestructuringEmpty.js",
+    "/node_modules/@babel/runtime/helpers/esm/objectSpread": "/node_modules/@babel/runtime/helpers/esm/objectSpread.js",
+    "/node_modules/@babel/runtime/helpers/esm/objectSpread2": "/node_modules/@babel/runtime/helpers/esm/objectSpread2.js",
+    "/node_modules/@babel/runtime/helpers/esm/objectWithoutProperties": "/node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js",
+    "/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose": "/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js",
+    "/node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn": "/node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn.js",
+    "/node_modules/@babel/runtime/helpers/esm/readOnlyError": "/node_modules/@babel/runtime/helpers/esm/readOnlyError.js",
+    "/node_modules/@babel/runtime/helpers/esm/set": "/node_modules/@babel/runtime/helpers/esm/set.js",
+    "/node_modules/@babel/runtime/helpers/esm/setPrototypeOf": "/node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js",
+    "/node_modules/@babel/runtime/helpers/esm/skipFirstGeneratorNext": "/node_modules/@babel/runtime/helpers/esm/skipFirstGeneratorNext.js",
+    "/node_modules/@babel/runtime/helpers/esm/slicedToArray": "/node_modules/@babel/runtime/helpers/esm/slicedToArray.js",
+    "/node_modules/@babel/runtime/helpers/esm/slicedToArrayLoose": "/node_modules/@babel/runtime/helpers/esm/slicedToArrayLoose.js",
+    "/node_modules/@babel/runtime/helpers/esm/superPropBase": "/node_modules/@babel/runtime/helpers/esm/superPropBase.js",
+    "/node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral": "/node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js",
+    "/node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteralLoose": "/node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteralLoose.js",
+    "/node_modules/@babel/runtime/helpers/esm/tdz": "/node_modules/@babel/runtime/helpers/esm/tdz.js",
+    "/node_modules/@babel/runtime/helpers/esm/temporalRef": "/node_modules/@babel/runtime/helpers/esm/temporalRef.js",
+    "/node_modules/@babel/runtime/helpers/esm/temporalUndefined": "/node_modules/@babel/runtime/helpers/esm/temporalUndefined.js",
+    "/node_modules/@babel/runtime/helpers/esm/toArray": "/node_modules/@babel/runtime/helpers/esm/toArray.js",
+    "/node_modules/@babel/runtime/helpers/esm/toConsumableArray": "/node_modules/@babel/runtime/helpers/esm/toConsumableArray.js",
+    "/node_modules/@babel/runtime/helpers/esm/toPrimitive": "/node_modules/@babel/runtime/helpers/esm/toPrimitive.js",
+    "/node_modules/@babel/runtime/helpers/esm/toPropertyKey": "/node_modules/@babel/runtime/helpers/esm/toPropertyKey.js",
+    "/node_modules/@babel/runtime/helpers/esm/typeof": "/node_modules/@babel/runtime/helpers/esm/typeof.js",
+    "/node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray": "/node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js",
+    "/node_modules/@babel/runtime/helpers/esm/wrapAsyncGenerator": "/node_modules/@babel/runtime/helpers/esm/wrapAsyncGenerator.js",
+    "/node_modules/@babel/runtime/helpers/esm/wrapNativeSuper": "/node_modules/@babel/runtime/helpers/esm/wrapNativeSuper.js",
+    "/node_modules/@babel/runtime/helpers/esm/wrapRegExp": "/node_modules/@babel/runtime/helpers/esm/wrapRegExp.js",
+    "/node_modules/@babel/runtime/helpers/esm/writeOnlyError": "/node_modules/@babel/runtime/helpers/esm/writeOnlyError.js",
+    "/node_modules/@babel/runtime/helpers/extends": "/node_modules/@babel/runtime/helpers/extends.js",
+    "/node_modules/@babel/runtime/helpers/get": "/node_modules/@babel/runtime/helpers/get.js",
+    "/node_modules/@babel/runtime/helpers/getPrototypeOf": "/node_modules/@babel/runtime/helpers/getPrototypeOf.js",
+    "/node_modules/@babel/runtime/helpers/inherits": "/node_modules/@babel/runtime/helpers/inherits.js",
+    "/node_modules/@babel/runtime/helpers/inheritsLoose": "/node_modules/@babel/runtime/helpers/inheritsLoose.js",
+    "/node_modules/@babel/runtime/helpers/initializerDefineProperty": "/node_modules/@babel/runtime/helpers/initializerDefineProperty.js",
+    "/node_modules/@babel/runtime/helpers/initializerWarningHelper": "/node_modules/@babel/runtime/helpers/initializerWarningHelper.js",
+    "/node_modules/@babel/runtime/helpers/instanceof": "/node_modules/@babel/runtime/helpers/instanceof.js",
+    "/node_modules/@babel/runtime/helpers/interopRequireDefault": "/node_modules/@babel/runtime/helpers/interopRequireDefault.js",
+    "/node_modules/@babel/runtime/helpers/interopRequireWildcard": "/node_modules/@babel/runtime/helpers/interopRequireWildcard.js",
+    "/node_modules/@babel/runtime/helpers/isNativeFunction": "/node_modules/@babel/runtime/helpers/isNativeFunction.js",
+    "/node_modules/@babel/runtime/helpers/isNativeReflectConstruct": "/node_modules/@babel/runtime/helpers/isNativeReflectConstruct.js",
+    "/node_modules/@babel/runtime/helpers/iterableToArray": "/node_modules/@babel/runtime/helpers/iterableToArray.js",
+    "/node_modules/@babel/runtime/helpers/iterableToArrayLimit": "/node_modules/@babel/runtime/helpers/iterableToArrayLimit.js",
+    "/node_modules/@babel/runtime/helpers/iterableToArrayLimitLoose": "/node_modules/@babel/runtime/helpers/iterableToArrayLimitLoose.js",
+    "/node_modules/@babel/runtime/helpers/jsx": "/node_modules/@babel/runtime/helpers/jsx.js",
+    "/node_modules/@babel/runtime/helpers/maybeArrayLike": "/node_modules/@babel/runtime/helpers/maybeArrayLike.js",
+    "/node_modules/@babel/runtime/helpers/newArrowCheck": "/node_modules/@babel/runtime/helpers/newArrowCheck.js",
+    "/node_modules/@babel/runtime/helpers/nonIterableRest": "/node_modules/@babel/runtime/helpers/nonIterableRest.js",
+    "/node_modules/@babel/runtime/helpers/nonIterableSpread": "/node_modules/@babel/runtime/helpers/nonIterableSpread.js",
+    "/node_modules/@babel/runtime/helpers/objectDestructuringEmpty": "/node_modules/@babel/runtime/helpers/objectDestructuringEmpty.js",
+    "/node_modules/@babel/runtime/helpers/objectSpread": "/node_modules/@babel/runtime/helpers/objectSpread.js",
+    "/node_modules/@babel/runtime/helpers/objectSpread2": "/node_modules/@babel/runtime/helpers/objectSpread2.js",
+    "/node_modules/@babel/runtime/helpers/objectWithoutProperties": "/node_modules/@babel/runtime/helpers/objectWithoutProperties.js",
+    "/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose": "/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js",
+    "/node_modules/@babel/runtime/helpers/possibleConstructorReturn": "/node_modules/@babel/runtime/helpers/possibleConstructorReturn.js",
+    "/node_modules/@babel/runtime/helpers/readOnlyError": "/node_modules/@babel/runtime/helpers/readOnlyError.js",
+    "/node_modules/@babel/runtime/helpers/set": "/node_modules/@babel/runtime/helpers/set.js",
+    "/node_modules/@babel/runtime/helpers/setPrototypeOf": "/node_modules/@babel/runtime/helpers/setPrototypeOf.js",
+    "/node_modules/@babel/runtime/helpers/skipFirstGeneratorNext": "/node_modules/@babel/runtime/helpers/skipFirstGeneratorNext.js",
+    "/node_modules/@babel/runtime/helpers/slicedToArray": "/node_modules/@babel/runtime/helpers/slicedToArray.js",
+    "/node_modules/@babel/runtime/helpers/slicedToArrayLoose": "/node_modules/@babel/runtime/helpers/slicedToArrayLoose.js",
+    "/node_modules/@babel/runtime/helpers/superPropBase": "/node_modules/@babel/runtime/helpers/superPropBase.js",
+    "/node_modules/@babel/runtime/helpers/taggedTemplateLiteral": "/node_modules/@babel/runtime/helpers/taggedTemplateLiteral.js",
+    "/node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose": "/node_modules/@babel/runtime/helpers/taggedTemplateLiteralLoose.js",
+    "/node_modules/@babel/runtime/helpers/tdz": "/node_modules/@babel/runtime/helpers/tdz.js",
+    "/node_modules/@babel/runtime/helpers/temporalRef": "/node_modules/@babel/runtime/helpers/temporalRef.js",
+    "/node_modules/@babel/runtime/helpers/temporalUndefined": "/node_modules/@babel/runtime/helpers/temporalUndefined.js",
+    "/node_modules/@babel/runtime/helpers/toArray": "/node_modules/@babel/runtime/helpers/toArray.js",
+    "/node_modules/@babel/runtime/helpers/toConsumableArray": "/node_modules/@babel/runtime/helpers/toConsumableArray.js",
+    "/node_modules/@babel/runtime/helpers/toPrimitive": "/node_modules/@babel/runtime/helpers/toPrimitive.js",
+    "/node_modules/@babel/runtime/helpers/toPropertyKey": "/node_modules/@babel/runtime/helpers/toPropertyKey.js",
+    "/node_modules/@babel/runtime/helpers/typeof": "/node_modules/@babel/runtime/helpers/typeof.js",
+    "/node_modules/@babel/runtime/helpers/unsupportedIterableToArray": "/node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js",
+    "/node_modules/@babel/runtime/helpers/wrapAsyncGenerator": "/node_modules/@babel/runtime/helpers/wrapAsyncGenerator.js",
+    "/node_modules/@babel/runtime/helpers/wrapNativeSuper": "/node_modules/@babel/runtime/helpers/wrapNativeSuper.js",
+    "/node_modules/@babel/runtime/helpers/wrapRegExp": "/node_modules/@babel/runtime/helpers/wrapRegExp.js",
+    "/node_modules/@babel/runtime/helpers/writeOnlyError": "/node_modules/@babel/runtime/helpers/writeOnlyError.js",
+    "/node_modules/@babel/runtime/package": "/node_modules/@babel/runtime/package.json",
+    "/node_modules/@babel/runtime/package.json": "/node_modules/@babel/runtime/package.json",
+    "/node_modules/@babel/runtime/regenerator": "/node_modules/@babel/runtime/regenerator/index.js",
+    "/node_modules/@babel/runtime/regenerator/": "/node_modules/@babel/runtime/regenerator/",
+    "/node_modules/@babel/runtime/regenerator/*.js": "/node_modules/@babel/runtime/regenerator/$1.js",
+  },
+}
+`;
diff --git a/packages/sandpack-core/src/resolver/resolver.test.ts b/packages/sandpack-core/src/resolver/resolver.test.ts
index c80c919198d..422637b26b3 100644
--- a/packages/sandpack-core/src/resolver/resolver.test.ts
+++ b/packages/sandpack-core/src/resolver/resolver.test.ts
@@ -2,7 +2,13 @@ import fs from 'fs';
 import path from 'path';
 import gensync from 'gensync';
 
-import { resolveSync, normalizeModuleSpecifier } from './resolver';
+import {
+  resolveSync,
+  normalizeModuleSpecifier,
+  _processPackageJSON,
+  getParentDirectories,
+} from './resolver';
+import { ModuleNotFoundError } from './errors/ModuleNotFound';
 
 const FIXTURE_PATH = path.join(__dirname, 'fixture');
 
@@ -27,7 +33,7 @@ const readFiles = (
   return files;
 };
 
-describe('resolver', () => {
+describe('resolve', () => {
   const files: Map<string, string> = readFiles(
     FIXTURE_PATH,
     FIXTURE_PATH,
@@ -95,6 +101,19 @@ describe('resolver', () => {
       });
       expect(resolved).toBe('/nested/index.js');
     });
+
+    it('should throw a module not found error if not found', () => {
+      expect(() => {
+        resolveSync('/nestedeeeee', {
+          filename: '/nested/test.js',
+          extensions: ['.ts', '.tsx', '.js', '.jsx'],
+          isFile,
+          readFile,
+        });
+      }).toThrowError(
+        new ModuleNotFoundError('/nestedeeeee', '/nested/test.js')
+      );
+    });
   });
 
   describe('node modules', () => {
@@ -118,6 +137,16 @@ describe('resolver', () => {
       expect(resolved).toBe('/node_modules/package-main/main.js');
     });
 
+    it('should be able to handle packages with nested package.json files, this is kinda invalid but whatever', () => {
+      const resolved = resolveSync('styled-components/macro', {
+        filename: '/foo.js',
+        extensions: ['.ts', '.tsx', '.js', '.jsx'],
+        isFile,
+        readFile,
+      });
+      expect(resolved).toBe('/node_modules/styled-components/dist/macro.js');
+    });
+
     it('should resolve a node_modules package.module', () => {
       const resolved = resolveSync('package-module', {
         filename: '/foo.js',
@@ -189,6 +218,19 @@ describe('resolver', () => {
       });
       expect(resolved).toBe('/node_modules/@scope/pkg/foo/bar.js');
     });
+
+    it('should throw a module not found error if not found', () => {
+      expect(() => {
+        resolveSync('unknown-module/test.js', {
+          filename: '/nested/test.js',
+          extensions: ['.ts', '.tsx', '.js', '.jsx'],
+          isFile,
+          readFile,
+        });
+      }).toThrowError(
+        new ModuleNotFoundError('unknown-module/test.js', '/nested/test.js')
+      );
+    });
   });
 
   describe('package#browser', () => {
@@ -384,3 +426,31 @@ describe('resolver', () => {
     });
   });
 });
+
+describe('process package.json', () => {
+  it('Should correctly process pkg.exports from @babel/runtime', () => {
+    const content = JSON.parse(
+      fs.readFileSync(
+        path.join(FIXTURE_PATH, 'node_modules/@babel/runtime/package.json'),
+        'utf-8'
+      )
+    );
+    const processedPkg = _processPackageJSON(
+      content,
+      '/node_modules/@babel/runtime'
+    );
+    expect(processedPkg).toMatchSnapshot();
+  });
+});
+
+describe('get parent directories', () => {
+  it('Should return a list of all parent directories', () => {
+    const directories = getParentDirectories('/src/index');
+    expect(directories).toEqual(['/src/index', '/src', '/']);
+  });
+
+  it('Should return a list of all parent directories above the rootDir', () => {
+    const directories = getParentDirectories('/src/index', '/src');
+    expect(directories).toEqual(['/src/index', '/src']);
+  });
+});