Use css-modules-require-hook instead of babel-plugin-webpack-loaders

due to postcss-loader breaks webpack-loaders plugin, the plugin not active maintenance, and we are ready to migrate to webpack 2.
ioram-devi · Mar 8, 2017 · 0538532 · 0538532
1 parent 48ac015
commit 0538532
Show file tree

Hide file tree

Showing 4 changed files with 1,416 additions and 1,255 deletions.
diff --git a/.babelrc b/.babelrc
@@ -1,11 +1,4 @@
 {
   "presets": ["es2015", "stage-0", "react"],
-  "plugins": ["add-module-exports", "transform-decorators-legacy", "transform-runtime"],
-  "env": {
-    "test": {
-      "plugins": [
-        ["webpack-loaders", { "config": "webpack/test.config.js", "verbose": false }]
-      ]
-    }
-  }
+  "plugins": ["add-module-exports", "transform-decorators-legacy", "transform-runtime"]
 }
diff --git a/package.json b/package.json
@@ -9,7 +9,7 @@
     "compress-keygen": "crx keygen",
     "clean": "rimraf build/ dev/ *.zip *.crx",
     "lint": "eslint app chrome test scripts webpack/*.js",
-    "test-e2e": "cross-env NODE_ENV=test mocha test/e2e",
+    "test-e2e": "cross-env NODE_ENV=test mocha -r ./test/setup-app test/e2e",
     "test": "cross-env NODE_ENV=test mocha -r ./test/setup-app test/app"
   },
   "repository": {
@@ -34,7 +34,6 @@
     "babel-plugin-add-module-exports": "^0.2.1",
     "babel-plugin-transform-decorators-legacy": "^1.2.0",
     "babel-plugin-transform-runtime": "^6.5.2",
-    "babel-plugin-webpack-loaders": "^0.8.0",
     "babel-preset-es2015": "^6.3.13",
     "babel-preset-react": "^6.3.13",
     "babel-preset-react-hmre": "^1.0.0",
@@ -46,6 +45,7 @@
     "cross-env": "^3.1.3",
     "crx": "^3.0.3",
     "css-loader": "^0.25.0",
+    "css-modules-require-hook": "^4.0.5",
     "eslint": "^3.9.1",
     "eslint-config-airbnb": "^12.0.0",
     "eslint-plugin-import": "^1.16.0",

diff --git a/test/setup-app.js b/test/setup-app.js
@@ -1,5 +1,12 @@
 import { jsdom } from 'jsdom';
+import hook from 'css-modules-require-hook';
+import postCSSConfig from '../webpack/postcss.config';
 
 global.document = jsdom('<!doctype html><html><body></body></html>');
 global.window = document.defaultView;
 global.navigator = global.window.navigator;
+
+hook({
+  generateScopedName: '[name]__[local]___[hash:base64:5]',
+  prepend: postCSSConfig.plugins,
+});