From 9353240d892aa75cbeb93c03e6102fa929bb976c Mon Sep 17 00:00:00 2001
From: Val Erastov <xibyte@gmail.com>
Date: Tue, 9 Jan 2018 21:57:42 -0800
Subject: [PATCH] enable css modules

---
 build/cssScoopeGenerator.js | 34 ++++++++++++++++++++++++++++++++++
 webpack.config.js           | 10 +++++++++-
 2 files changed, 43 insertions(+), 1 deletion(-)
 create mode 100644 build/cssScoopeGenerator.js

diff --git a/build/cssScoopeGenerator.js b/build/cssScoopeGenerator.js
new file mode 100644
index 00000000..2322ae43
--- /dev/null
+++ b/build/cssScoopeGenerator.js
@@ -0,0 +1,34 @@
+const path = require('path');
+
+module.exports = function() {
+  const index = {};
+  const componentNames = {};
+  
+  return function (localName, resourcePath) {
+    let id = index[resourcePath];
+    if (id === undefined) {
+      id = getComponentName(resourcePath);
+      index[resourcePath] = id;
+    }
+    if (localName === 'root') {
+      localName = '';
+    }  else {
+      localName = '-' + localName
+    }
+    return 'x-' + id + localName;
+  };
+
+  function getComponentName(resourcePath) {
+    let filename = path.basename(resourcePath);
+    let name = path.parse(filename).name;
+    let suffix = '';
+    let collisionCounter = 0;    
+    while (componentNames[name + suffix] !== undefined) {
+      suffix = collisionCounter ++;
+    }
+    name = name + suffix;
+    componentNames[name] = true;
+    return name;
+  }
+};
+
diff --git a/webpack.config.js b/webpack.config.js
index 9cc8863c..b93baccb 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,5 +1,6 @@
 const path = require('path');
 const webpack = require('webpack');
+const generateCSSScopedName = require('./build/cssScoopeGenerator')();
 
 const WEB_APP = path.join(__dirname, 'web/app');
 const MODULES = path.join(__dirname, 'modules');
@@ -43,7 +44,14 @@ module.exports = {
       test: /\.less$/,
       use: [
         'style-loader',
-        'css-loader?-url',
+        {
+          loader: 'css-loader',
+          options: {
+            getLocalIdent: (context, localIdentName, localName) => generateCSSScopedName(localName, context.resourcePath),
+            modules: true,
+            url: false
+          }
+        },
         'less-loader'
       ]    
     },