Fix css modules in vue

Author: Ives van Hoorne

src/sandbox/eval/transpilers/css/get-modules.js

@@ -1,11 +1,16 @@
 // @flow
-import Core from 'css-modules-loader-core';
 import { type LoaderContext } from '../../transpiled-module';
 
-const core = new Core();
+let core = null;
 
-export default (code: string, loaderContext: LoaderContext) =>
-  core
+export default async (code: string, loaderContext: LoaderContext) => {
+  if (!core) {
+    const Core = await import('css-modules-loader-core');
+
+    core = new Core();
+  }
+
+  return core
     .load(code, loaderContext.path, (dependencyPath: string) => {
       const tModule = loaderContext.addDependency(dependencyPath);
 
@@ -15,3 +20,4 @@ export default (code: string, loaderContext: LoaderContext) =>
       css: injectableSource,
       exportTokens,
     }));
+};

src/sandbox/eval/transpilers/vue/loader.js

@@ -21,15 +21,17 @@ const getStyleFileName = attrs => {
 };
 
 const getStyleLoaders = (attrs, id, scoped) => {
-  let loader = `!style-loader!vue-style-compiler?${JSON.stringify({
-    id,
-    scoped: !!scoped,
-  })}`;
+  let loader = `!style-loader`;
 
   if (attrs.module) {
     loader += `?${JSON.stringify({ module: true })}`;
   }
 
+  loader += `!vue-style-compiler?${JSON.stringify({
+    id,
+    scoped: !!scoped,
+  })}`;
+
   if (attrs.lang === 'scss') loader += '!sass-loader';
   if (attrs.lang === 'sass') loader += '!sass-loader';
   if (attrs.lang === 'styl' || attrs.lang === 'stylus')