Make babel 7 work

Author: CompuIves

packages/app/src/sandbox/eval/transpiled-module.js

@@ -766,10 +766,6 @@ export default class TranspiledModule {
           localModule.path
         );
 
-        if (transpiledModule === requiredTranspiledModule) {
-          throw new Error(`${localModule.path} is importing itself`);
-        }
-
         // Check if this module has been evaluated before, if so return the exports
         // of that compilation
         const cache = requiredTranspiledModule.compilation;

packages/app/src/sandbox/eval/transpilers/babel/worker/babel-worker.js

@@ -18,6 +18,7 @@ import {
 } from './get-prefixed-name';
 
 let fsInitialized = false;
+let lastConfig = null;
 
 async function initializeBrowserFS() {
   return new Promise(resolve => {
@@ -242,7 +243,11 @@ self.addEventListener('message', async event => {
     );
   }
 
-  resetCache();
+  const stringifiedConfig = JSON.stringify(babelTranspilerOptions);
+  if (lastConfig !== stringifiedConfig) {
+    resetCache();
+    lastConfig = stringifiedConfig;
+  }
 
   const flattenedPresets = flatten(config.presets || []);
   const flattenedPlugins = flatten(config.plugins || []);
@@ -340,12 +345,27 @@ self.addEventListener('message', async event => {
       }
     }
 
-    plugins.push(['babel-plugin-detective', { source: true, nodes: true }]);
-
-    const customConfig = {
-      ...config,
-      plugins,
-    };
+    plugins.push([
+      'babel-plugin-detective',
+      { source: true, nodes: true, generated: true },
+    ]);
+
+    const customConfig = path.startsWith('/node_modules')
+      ? {
+          plugins: [
+            version === 7
+              ? 'transform-modules-commonjs'
+              : 'transform-es2015-modules-commonjs',
+            [
+              'babel-plugin-detective',
+              { source: true, nodes: true, generated: true },
+            ],
+          ],
+        }
+      : {
+          ...config,
+          plugins,
+        };
 
     const result = Babel.transform(code, customConfig);
 

packages/app/src/sandbox/eval/transpilers/babel/worker/evaluate.js

@@ -99,7 +99,12 @@ export default function evaluate(
   // require.resolve is often used in .babelrc configs to resolve the correct plugin path,
   // we want to return a function for that, because our babelrc configs don't really understand
   // strings as plugins.
-  require.resolve = require;
+  require.resolve = requirePath => requirePath;
+  // resolve.sync(requirePath, {
+  //   filename: path,
+  //   extensions: ['.js', '.json'],
+  //   moduleDirectory: ['node_modules'],
+  // });
 
   const module = {
     id: path,
@@ -112,7 +117,9 @@ export default function evaluate(
   }
   finalCode += `\n//# sourceURL=${location.origin}${path}`;
 
-  evaluateCode(finalCode, require, module);
+  evaluateCode(finalCode, require, module, {
+    VUE_CLI_BABEL_TRANSPILE_MODULES: true,
+  });
 
   return module.exports;
 }