Add export default option

README.md

@@ -106,6 +106,33 @@ export const SomeComponent: string;
 
 See also [webpack css-loader's camelCase option](https://github.com/webpack/css-loader#camelcase).
 
+#### Use `export default` syntax
+With `-x` or `--exportDefault`, this tool will use the [export default declaration syntax](https://github.com/Microsoft/TypeScript/blob/master/doc/spec.md#11342-export-default-declarations) rather than the default [export assignment syntax](https://github.com/Microsoft/TypeScript/blob/master/doc/spec.md#1135-export-assignments).
+
+If you have the following css,
+
+```css
+/* stylesWithExportDefault.css */
+
+@value primary: red;
+
+.myClass {
+  color: primary;
+}
+```
+
+typed-css-modules creates the following .d.ts files from the above css:
+
+```ts
+/* stylesWithExportDefault.css.d.ts */
+declare const styles: {
+  readonly "primary": string;
+  readonly "myClass": string;
+};
+export default styles;
+```
+
+
 ## API
 
 ```sh
@@ -133,6 +160,7 @@ You can set the following options:
 * `option.outDir`: Output directory(default: `option.searchDir`).
 * `option.camelCase`: Camelize CSS class tokens.
 * `option.EOL`: EOL (end of line) for the generated `d.ts` files. Possible values `'\n'` or `'\r\n'`(default: `os.EOL`).
+* `option.exportDefault`: Uses `export default styles` syntax fir the generated `d.ts` files.
 
 #### `create(filepath, contents) => Promise(dtsContent)`
 Returns `DtsContent` instance.

package.json

@@ -8,7 +8,7 @@
     "test": "jest",
     "test:watch": "jest --watch",
     "test:ci": "jest --coverage",
-    "prepublish": "npm run build"
+    "prepare": "npm run build"
   },
   "bin": {
     "tcm": "lib/cli.js"

src/cli.js

@@ -19,6 +19,7 @@ let yarg = yargs.usage('Create .css.d.ts from CSS modules *.css files.\nUsage: $
   .alias('w', 'watch').describe('w', 'Watch input directory\'s css files or pattern').boolean('w')
   .alias('d', 'dropExtension').describe('d', 'Drop the input files extension').boolean('d')
   .alias('s', 'silent').describe('s', 'Silent output. Do not show "files written" or warning messages').boolean('s')
+  .alias('x', 'exportDefault').describe('x', 'Use "export default" syntax for .d.ts files').boolean('x')
   .alias('h', 'help').help('h')
   .version(() => require('../package.json').version)
 let argv = yarg.argv;
@@ -62,7 +63,8 @@ let main = () => {
     searchDir,
     outDir: argv.o,
     camelCase: argv.c,
-    dropExtension: argv.d
+    dropExtension: argv.d,
+    exportDefault: argv.x
   });
 
   if(!argv.w) {

src/dtsCreator.js

@@ -25,7 +25,8 @@ class DtsContent {
     rInputPath,
     rawTokenList,
     resultList,
-    EOL
+    EOL,
+    exportDefault
   }) {
     this.dropExtension = dropExtension;
     this.rootDir = rootDir;
@@ -35,6 +36,7 @@ class DtsContent {
     this.rawTokenList = rawTokenList;
     this.resultList = resultList;
     this.EOL = EOL;
+    this.exportDefault = exportDefault;
   }
 
   get contents() {
@@ -47,7 +49,7 @@ class DtsContent {
       'declare const styles: {',
       ...this.resultList.map(line => '  ' + line),
       '};',
-      'export = styles;',
+      this.exportDefault ? 'export default styles;' : 'export = styles;',
       ''
     ].join(os.EOL) + this.EOL;
   }
@@ -94,6 +96,7 @@ export class DtsCreator {
     this.camelCase = options.camelCase;
     this.dropExtension = !!options.dropExtension;
     this.EOL = options.EOL || os.EOL;
+    this.exportDefault = !!options.exportDefault;
   }
 
   create(filePath, initialContents, clearCache = false) {
@@ -126,7 +129,8 @@ export class DtsCreator {
             rInputPath,
             rawTokenList: keys,
             resultList: result,
-            EOL: this.EOL
+            EOL: this.EOL,
+            exportDefault: this.exportDefault
           });
 
           resolve(content);

test/dtsCreator.spec.js

@@ -121,6 +121,25 @@ export = styles;
       });
     });
 
+    describe('#exportDefault option', () => {
+      it('returns formatted .d.ts string', done => {
+        new DtsCreator({ exportDefault: true }).create('test/testStyleExportDefault.css').then(content => {
+          assert.equal(
+            content.formatted,
+            `\
+declare const styles: {
+  readonly "myClass": string;
+  readonly "anotherClass": string;
+};
+export default styles;
+
+`
+          );
+          done();
+        });
+      });
+    })
+
     describe('#camelCase option', () => {
       it('camelCase == true: returns camelized tokens for lowercase classes', done => {
         new DtsCreator({ camelCase: true })

test/testStyleExportDefault.css

@@ -0,0 +1,2 @@
+.myClass {color: red;}
+.anotherClass {color: pink;}