fixed [#issue-61](https://github.com/Jimdo/typings-for-css-modules-lo…

CHANGELOG.md

@@ -0,0 +1,6 @@
+## CHANGELOG
+
+#### 1.8.0
+* added *indent* option. [#issue-61](https://github.com/Jimdo/typings-for-css-modules-loader/issues/61)
+* added *isSingleQuote* option. [#issue-61](https://github.com/Jimdo/typings-for-css-modules-loader/issues/61)
+

README.md

@@ -72,6 +72,36 @@ To add a "banner" prefix to each generated `*.d.ts` file, you can pass a string
   { test: /\.css$/, loader: 'typings-for-css-modules?banner="// This file is automatically generated by typings-for-css-modules.\n// Please do not change this file!"' }
 ```
 
+### `indent`-option
+
+to add the given spaces front of each fields of module. ( default : '  ')
+
+```json
+{
+  loader: "typings-for-css-modules-loader",
+  options: {
+    modules: true,
+    indent: '    ',
+    isSingleQuote: false
+   }
+}
+```
+
+### `isSingleQuote`-option
+
+to use *'*, *"* quote mark for each fields of module. ( default : *'*)
+
+```json
+{
+  loader: "typings-for-css-modules-loader",
+  options: {
+    modules: true,
+    indent: '    ',
+    isSingleQuote: false
+   }
+}
+```
+
 ## Usage
 
 Keep your `webpack.config` as is just instead of using `css-loader` use `typings-for-css-modules-loader`

package.json

@@ -1,6 +1,6 @@
 {
   "name": "typings-for-css-modules-loader",
-  "version": "1.7.0",
+  "version": "1.8.0",
   "description": "Drop-in replacement for css-loader to generate typings for your CSS-Modules on the fly in webpack",
   "main": "lib/index.js",
   "scripts": {

src/cssModuleToInterface.js

@@ -6,9 +6,10 @@ const filenameToInterfaceName = (filename) => {
     .replace(/\W+(\w)/g, (_, c) => c.toUpperCase());
 };
 
-const cssModuleToTypescriptInterfaceProperties = (cssModuleKeys, indent = '  ') => {
+const cssModuleToTypescriptInterfaceProperties = (cssModuleKeys, isSingleQuote = true , indent = '  ') => {
+  const quote = isSingleQuote ? "'": '"';
   return cssModuleKeys
-    .map((key) => `${indent}'${key}': string;`)
+    .map((key) => `${indent}${quote}${key}${quote}: string;`)
     .join('\n');
 };
 
@@ -86,9 +87,9 @@ export const generateNamedExports = (cssModuleKeys) => {
 `);
 };
 
-export const generateGenericExportInterface = (cssModuleKeys, filename, indent) => {
+export const generateGenericExportInterface = (cssModuleKeys, filename, isSingleQuote, indent) => {
   const interfaceName = filenameToInterfaceName(filename);
-  const interfaceProperties = cssModuleToTypescriptInterfaceProperties(cssModuleKeys, indent);
+  const interfaceProperties = cssModuleToTypescriptInterfaceProperties(cssModuleKeys, isSingleQuote, indent);
   return (
 `export interface ${interfaceName} {
 ${interfaceProperties}

src/index.js

@@ -53,7 +53,7 @@ module.exports = function(...input) {
 
     let cssModuleDefinition;
     if (!query.namedExport) {
-      cssModuleDefinition = generateGenericExportInterface(cssModuleKeys, filename);
+      cssModuleDefinition = generateGenericExportInterface(cssModuleKeys, filename, query.isSingleQuote, query.indent);
     } else {
       const [cleanedDefinitions, skippedDefinitions,] = filterNonWordClasses(cssModuleKeys);
       if (skippedDefinitions.length > 0 && !query.camelCase) {