From 4381a97a8296147c3698f3d30714249ded545707 Mon Sep 17 00:00:00 2001 From: Joscha Feth Date: Thu, 9 Mar 2017 22:32:10 +1100 Subject: [PATCH 1/4] feat: allow removal of original class name --- README.md | 9 +++++++++ lib/compile-exports.js | 8 +++++--- test/camelCaseTest.js | 10 ++++++++++ 3 files changed, 24 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 9fd5ecc7..dea8943f 100644 --- a/README.md +++ b/README.md @@ -421,6 +421,15 @@ By default, the exported JSON keys mirror the class names. If you want to cameli import { className } from 'file.css'; ``` +#### Possible options + +|Option|Behaviour| +|:----:|:--------| +|**`true`**|Class names will be camelized| +|**`'dashes'`**|Only dashes in class names will be camelized| +|**`'only'`** |Class names will be camelized, the original class name will be removed from the locals| +|**`'dashesOnly'`**|Dashes in class names will be camelized, the original class name will be removed from the locals| +

Maintainers

diff --git a/lib/compile-exports.js b/lib/compile-exports.js index 318743ce..04f97b0d 100644 --- a/lib/compile-exports.js +++ b/lib/compile-exports.js @@ -17,15 +17,17 @@ module.exports = function compileExports(result, importItemMatcher, camelCaseKey function addEntry(k) { res.push("\t" + JSON.stringify(k) + ": " + valueAsString); } - addEntry(key); + if (camelCaseKeys !== 'only' && camelCaseKeys !== 'dashesOnly') { + addEntry(key); + } var targetKey; - if (camelCaseKeys === true) { + if (camelCaseKeys === true || camelCaseKeys === 'only') { targetKey = camelCase(key); if (targetKey !== key) { addEntry(targetKey); } - } else if (camelCaseKeys === 'dashes') { + } else if (camelCaseKeys === 'dashes' || camelCaseKeys === 'dashesOnly') { targetKey = dashesCamelCase(key); if (targetKey !== key) { addEntry(targetKey); diff --git a/test/camelCaseTest.js b/test/camelCaseTest.js index c8be53b3..9eb22a59 100644 --- a/test/camelCaseTest.js +++ b/test/camelCaseTest.js @@ -14,14 +14,24 @@ describe("camelCase", function() { ], dashes: [ [1, "._1L-rnCOXCE_7H94L5XT4uB { color: blue; }", ""] + ], + withoutOnly: [ + [1, "._1L-rnCOXCE_7H94L5XT4uB { color: blue; }", ""] + ], + dashesOnly: [ + [1, "._1L-rnCOXCE_7H94L5XT4uB { color: blue; }", ""] ] }; exports.with.locals = {'btn-info_is-disabled': '_1L-rnCOXCE_7H94L5XT4uB'}; exports.without.locals = {btnInfoIsDisabled: '_1L-rnCOXCE_7H94L5XT4uB', 'btn-info_is-disabled': '_1L-rnCOXCE_7H94L5XT4uB'}; exports.dashes.locals = {btnInfo_isDisabled: '_1L-rnCOXCE_7H94L5XT4uB', 'btn-info_is-disabled': '_1L-rnCOXCE_7H94L5XT4uB'}; + exports.withoutOnly.locals = {btnInfoIsDisabled: '_1L-rnCOXCE_7H94L5XT4uB'}; + exports.dashesOnly.locals = {btnInfo_isDisabled: '_1L-rnCOXCE_7H94L5XT4uB'}; test("with", css, exports.with, "?modules"); test("without", css, exports.without, "?modules&camelCase"); test("dashes", css, exports.dashes, "?modules&camelCase=dashes"); + test("withoutOnly", css, exports.withoutOnly, "?modules&camelCase=only"); + test("dashesOnly", css, exports.dashesOnly, "?modules&camelCase=dashesOnly"); testRaw("withoutRaw", '.a {}', 'exports.locals = {\n\t"a": "_1buUQJccBRS2-2i27LCoDf"\n};', "?modules&camelCase"); testRaw("dashesRaw", '.a {}', 'exports.locals = {\n\t"a": "_1buUQJccBRS2-2i27LCoDf"\n};', "?modules&camelCase=dashes"); From ebc0e7cf62d4a62ed42d5990dc2b96a76c5f6a8a Mon Sep 17 00:00:00 2001 From: Joscha Feth Date: Thu, 9 Mar 2017 22:37:42 +1100 Subject: [PATCH 2/4] add comment for 1.0.0 --- test/camelCaseTest.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/test/camelCaseTest.js b/test/camelCaseTest.js index 9eb22a59..5c669e84 100644 --- a/test/camelCaseTest.js +++ b/test/camelCaseTest.js @@ -30,7 +30,9 @@ describe("camelCase", function() { test("with", css, exports.with, "?modules"); test("without", css, exports.without, "?modules&camelCase"); test("dashes", css, exports.dashes, "?modules&camelCase=dashes"); + // Remove this option in v1.0.0 and make the removal of the original classname the default behaviour. See #440. test("withoutOnly", css, exports.withoutOnly, "?modules&camelCase=only"); + // Remove this option in v1.0.0 and make the removal of the original classname the default behaviour. See #440. test("dashesOnly", css, exports.dashesOnly, "?modules&camelCase=dashesOnly"); testRaw("withoutRaw", '.a {}', 'exports.locals = {\n\t"a": "_1buUQJccBRS2-2i27LCoDf"\n};', "?modules&camelCase"); From 9574dc03aeb1e513c6da2226370c19addd6524e2 Mon Sep 17 00:00:00 2001 From: Joscha Feth Date: Fri, 10 Mar 2017 09:33:08 +1100 Subject: [PATCH 3/4] docs: move table --- README.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/README.md b/README.md index dea8943f..a1aca423 100644 --- a/README.md +++ b/README.md @@ -398,6 +398,15 @@ You can also disable or enforce minification with the `minimize` query parameter By default, the exported JSON keys mirror the class names. If you want to camelize class names (useful in JS), pass the query parameter `camelCase` to css-loader. +#### Possible Options + +|Option|Behaviour| +|:----:|:--------| +|**`true`**|Class names will be camelized| +|**`'dashes'`**|Only dashes in class names will be camelized| +|**`'only'`** |Class names will be camelized, the original class name will be removed from the locals| +|**`'dashesOnly'`**|Dashes in class names will be camelized, the original class name will be removed from the locals| + **webpack.config.js** ```js { @@ -421,15 +430,6 @@ By default, the exported JSON keys mirror the class names. If you want to cameli import { className } from 'file.css'; ``` -#### Possible options - -|Option|Behaviour| -|:----:|:--------| -|**`true`**|Class names will be camelized| -|**`'dashes'`**|Only dashes in class names will be camelized| -|**`'only'`** |Class names will be camelized, the original class name will be removed from the locals| -|**`'dashesOnly'`**|Dashes in class names will be camelized, the original class name will be removed from the locals| -

Maintainers

From 8ce02a069e77e8126111340c3e12d2bc82c7f663 Mon Sep 17 00:00:00 2001 From: Joscha Feth Date: Fri, 10 Mar 2017 09:33:35 +1100 Subject: [PATCH 4/4] docs: consistency --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index a1aca423..47a951b8 100644 --- a/README.md +++ b/README.md @@ -400,7 +400,7 @@ By default, the exported JSON keys mirror the class names. If you want to cameli #### Possible Options -|Option|Behaviour| +|Option|Description| |:----:|:--------| |**`true`**|Class names will be camelized| |**`'dashes'`**|Only dashes in class names will be camelized|