added an example where a file is being imported and composed

Author: geelen

package.json

@@ -8,7 +8,7 @@
   },
   "dependencies": {
     "postcss": "^4.1.11",
-    "postcss-modules-extract-imports": "^0.0.5",
+    "postcss-modules-extract-imports": "^0.0.6",
     "postcss-modules-local-by-default": "^0.0.9",
     "postcss-modules-scope": "^0.0.8"
   },

src/index.js

@@ -2,7 +2,7 @@ import postcss from 'postcss'
 import localByDefault from 'postcss-modules-local-by-default'
 import extractImports from 'postcss-modules-extract-imports'
 import scope from 'postcss-modules-scope'
-import wip from "./wip"
+import constants from "./postcss-modules-constants"
 
 import Parser from './parser'
 
@@ -27,4 +27,4 @@ export default class Core {
 Core.localByDefault = localByDefault
 Core.extractImports = extractImports
 Core.scope = scope
-Core.defaultPlugins = [wip, localByDefault, extractImports, scope]
+Core.defaultPlugins = [constants, localByDefault, extractImports, scope]

src/wip.js renamed to src/postcss-modules-constants.js

@@ -1,2 +1,16 @@
-@let primary: aquamarine;
-@let secondary: red;
+@let primary: #f01;
+@let secondary: #2f2;
+
+.text-primary {
+  color: primary;
+}
+.bg-primary {
+  background-color: primary;
+}
+
+.text-secondary {
+  color: secondary;
+}
+.bg-secondary {
+  background-color: secondary;
+}

test/test-cases/constants/colors.css

@@ -1,11 +1,23 @@
 ._constants_borders__dashed {
   border: 4px dashed;
 }
+._constants_colors__text-primary {
+  color: #f01;
+}
+._constants_colors__bg-primary {
+  background-color: #f01;
+}
 
+._constants_colors__text-secondary {
+  color: #2f2;
+}
+._constants_colors__bg-secondary {
+  background-color: #2f2;
+}
 
 ._constants_source__foo {
-  background: aquamarine;
-  border-color: red;
+  box-shadow: 0 0 10px #f01;
+  border-color: #2f2;
 }
 
 @media (max-width: 599px) {

test/test-cases/constants/expected.css

@@ -1,5 +1,5 @@
 {
   "borders": "\"./borders.css\"",
   "breakpoints": "\"./breakpoints.css\"",
-  "foo": "_constants_source__foo _constants_borders__dashed"
+  "foo": "_constants_source__foo _constants_borders__dashed _constants_colors__text-secondary"
 }

test/test-cases/constants/expected.json

@@ -4,7 +4,8 @@
 
 .foo {
   composes: dashed from borders;
-  background: blue;
+  composes: text-secondary from "./colors.css";
+  box-shadow: 0 0 10px blue;
   border-color: secondary;
 }