diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..eb18c68 --- /dev/null +++ b/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) + diff --git a/README.md b/README.md index f4de421..aaea6e4 100644 --- a/README.md +++ b/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` diff --git a/package.json b/package.json index b9d0705..d883ffd 100644 --- a/package.json +++ b/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": { diff --git a/src/cssModuleToInterface.js b/src/cssModuleToInterface.js index 272e431..4fe0fed 100644 --- a/src/cssModuleToInterface.js +++ b/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} diff --git a/src/index.js b/src/index.js index 269c2d8..630d9d5 100644 --- a/src/index.js +++ b/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) {