use module keys right away intead of the complete module.export of the locals loader

Author: timse

src/cssModuleToInterface.js

@@ -6,8 +6,8 @@ const filenameToInterfaceName = (filename) => {
     .replace(/\W+(\w)/g, (_, c) => c.toUpperCase());
 };
 
-const cssModuleToTypescriptInterfaceProperties = (cssModuleObject, indent = '  ') => {
-  return Object.keys(cssModuleObject)
+const cssModuleToTypescriptInterfaceProperties = (cssModuleKeys, indent = '  ') => {
+  return cssModuleKeys
     .map((key) => `${indent}'${key}': string;`)
     .join('\n');
 };
@@ -18,9 +18,9 @@ export const filenameToTypingsFilename = (filename) => {
   return path.join(dirName, `${baseName}.d.ts`);
 };
 
-export const generateInterface = (cssModuleObject, filename, indent) => {
+export const generateInterface = (cssModuleKeys, filename, indent) => {
   const interfaceName = filenameToInterfaceName(filename);
-  const interfaceProperties = cssModuleToTypescriptInterfaceProperties(cssModuleObject, indent);
+  const interfaceProperties = cssModuleToTypescriptInterfaceProperties(cssModuleKeys, indent);
   return (
 `export interface ${interfaceName} {
 ${interfaceProperties}

src/index.js

@@ -27,11 +27,12 @@ module.exports = function(input) {
 
   // mock async step 2 - offer css loader a "fake" callback
   this.async = () => (err, content) => {
-    const cssmodules = this.exec(content, this.resource);
     const requestedResource = this.resourcePath;
-
     const cssModuleInterfaceFilename = filenameToTypingsFilename(requestedResource);
-    const cssModuleInterface = generateInterface(cssmodules, requestedResource);
+
+    let cssModuleKeys = Object.keys(this.exec(content, this.resource));
+
+    const cssModuleInterface = generateInterface(cssModuleKeys, requestedResource);
     persist.writeToFileIfChanged(cssModuleInterfaceFilename, cssModuleInterface);
     // mock async step 3 - make `async` return the actual callback again before calling the 'real' css-loader
     delegateToCssLoader(this, input, callback);