Skip to content

Commit 6fdbe24

Browse files
authored
Revert "Feature: having postcss syntax configurable"
1 parent f343ab1 commit 6fdbe24

File tree

9 files changed

+12
-65
lines changed

9 files changed

+12
-65
lines changed

.flowconfig

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,3 @@
22
<PROJECT_ROOT>/node_modules/config-chain/test/broken.json
33
<PROJECT_ROOT>/node_modules/conventional-changelog-core/test/fixtures/_malformation.json
44
<PROJECT_ROOT>/node_modules/npmconf/test/fixtures/package.json
5-
6-
[options]
7-
module.ignore_non_literal_requires=true

README.md

Lines changed: 1 addition & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@ In contrast to [`react-css-modules`](https://github.com/gajus/react-css-modules)
2020
* [Anonymous reference](#anonymous-reference)
2121
* [Named reference](#named-reference)
2222
* [Configuration](#configuration)
23-
* [Configurate syntax loaders](#configurate-syntax-loaders)
2423
* [Installation](#installation)
2524
* [Example transpilations](#example-transpilations)
2625
* [Anonymous `styleName` resolution](#anonymous-stylename-resolution)
@@ -168,33 +167,14 @@ NODE_ENV=production ./test
168167

169168
|Name|Description|Default|
170169
|---|---|---|
171-
|`context`|Must match webpack [`context`](https://webpack.github.io/docs/configuration.html#context) configuration. [`css-loader`](https://github.com/webpack/css-loader) inherits `context` values from webpack. Other CSS module implementations might use different context resolution logic.|`process.cwd()`|
172-
|`filetypes`|Configure [postcss syntax loaders](https://github.com/postcss/postcss#syntaxes) like sugerss, LESS and SCSS. ||
173170
|`generateScopedName`|Refer to [Generating scoped names](https://github.com/css-modules/postcss-modules#generating-scoped-names)|`[path]___[name]__[local]___[hash:base64:5]`|
171+
|`context`|Must match webpack [`context`](https://webpack.github.io/docs/configuration.html#context) configuration. [`css-loader`](https://github.com/webpack/css-loader) inherits `context` values from webpack. Other CSS module implementations might use different context resolution logic.|`process.cwd()`|
174172

175173
Missing a configuration? [Raise an issue](https://github.com/gajus/babel-plugin-react-css-modules/issues/new?title=New%20configuration:).
176174

177175
> Note:
178176
> The default configuration should work out of the box with the [css-loader](https://github.com/webpack/css-loader).
179177
180-
### Configurate syntax loaders
181-
182-
To add support for different CSS syntaxes (e.g. SCSS), perform the following two steps:
183-
184-
1. Add the [postcss syntax loader](https://github.com/postcss/postcss#syntaxes) as a development dependency:
185-
186-
```bash
187-
npm install postcss-scss --save-dev
188-
```
189-
190-
2. Add a filetype syntax mapping to the Babel plugin configuration
191-
192-
```json
193-
"filetypes": {
194-
".scss": "postcss-scss"
195-
}
196-
```
197-
198178
## Installation
199179

200180
When `babel-plugin-react-css-modules` cannot resolve CSS module at a compile time, it imports a helper function (read [Runtime `styleName` resolution](#runtime-stylename-resolution)). Therefore, you must install `babel-plugin-react-css-modules` as a direct dependency of the project.

package.json

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,8 @@
1414
"postcss-modules-local-by-default": "^1.1.1",
1515
"postcss-modules-parser": "^1.1.0",
1616
"postcss-modules-scope": "^1.0.2",
17-
"postcss-modules-values": "^1.2.2"
17+
"postcss-modules-values": "^1.2.2",
18+
"postcss-scss": "^0.4.0"
1819
},
1920
"description": "Transforms styleName to className using compile time CSS module resolution.",
2021
"devDependencies": {
@@ -30,9 +31,7 @@
3031
"flow-bin": "^0.37.4",
3132
"husky": "^0.12.0",
3233
"mocha": "^3.2.0",
33-
"semantic-release": "^6.3.5",
34-
"postcss-less": "^0.15.0",
35-
"postcss-scss": "^0.4.0"
34+
"semantic-release": "^6.3.5"
3635
},
3736
"engines": {
3837
"node": ">5.0.0"

src/index.js

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -61,11 +61,7 @@ export default ({
6161
inherits: babelPluginJsxSyntax,
6262
visitor: {
6363
ImportDeclaration (path: Object, stats: Object): void {
64-
stats.opts.filetypes = stats.opts.filetypes || {};
65-
66-
const extension = path.node.source.value.lastIndexOf('.') > -1 ? path.node.source.value.substr(path.node.source.value.lastIndexOf('.')) : null;
67-
68-
if (extension !== '.css' && Object.keys(stats.opts.filetypes).indexOf(extension) < 0) {
64+
if (!path.node.source.value.endsWith('.css') && !path.node.source.value.endsWith('.scss')) {
6965
return;
7066
}
7167

@@ -88,7 +84,6 @@ export default ({
8884
}
8985

9086
filenameMap[filename].styleModuleImportMap[styleImportName] = requireCssModule(targetResourcePath, {
91-
filetypes: stats.opts.filetypes || {},
9287
generateScopedName: stats.opts.generateScopedName
9388
});
9489
},

src/requireCssModule.js

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -14,21 +14,20 @@ import LocalByDefault from 'postcss-modules-local-by-default';
1414
import Parser from 'postcss-modules-parser';
1515
import Scope from 'postcss-modules-scope';
1616
import Values from 'postcss-modules-values';
17+
import ScssSyntax from 'postcss-scss';
1718
import type {
1819
StyleModuleMapType
1920
} from './types';
2021

21-
const getTokens = (runner, cssSourceFilePath: string, filetypes): StyleModuleMapType => {
22-
const extension = cssSourceFilePath.substr(cssSourceFilePath.lastIndexOf('.'));
23-
const syntax = filetypes[extension];
22+
const getTokens = (runner, cssSourceFilePath: string): StyleModuleMapType => {
23+
const sourceFilePathIsScss = cssSourceFilePath.endsWith('.scss');
2424

2525
const options: Object = {
2626
from: cssSourceFilePath
2727
};
2828

29-
if (syntax) {
30-
// eslint-disable-next-line import/no-dynamic-require, global-require
31-
options.syntax = require(syntax);
29+
if (sourceFilePathIsScss) {
30+
options.syntax = ScssSyntax;
3231
}
3332

3433
const lazyResult = runner
@@ -45,7 +44,6 @@ const getTokens = (runner, cssSourceFilePath: string, filetypes): StyleModuleMap
4544
};
4645

4746
type OptionsType = {|
48-
filetypes: Object,
4947
generateScopedName?: string,
5048
context?: string
5149
|};
@@ -62,7 +60,7 @@ export default (cssSourceFilePath: string, options: OptionsType): StyleModuleMap
6260
const fromDirectoryPath = dirname(from);
6361
const toPath = resolve(fromDirectoryPath, to);
6462

65-
return getTokens(runner, toPath, options.filetypes);
63+
return getTokens(runner, toPath);
6664
};
6765

6866
const plugins = [
@@ -79,5 +77,5 @@ export default (cssSourceFilePath: string, options: OptionsType): StyleModuleMap
7977

8078
runner = postcss(plugins);
8179

82-
return getTokens(runner, cssSourceFilePath, options.filetypes);
80+
return getTokens(runner, cssSourceFilePath);
8381
};

test/fixtures/react-css-modules/resolves less stylesheets/actual.js

Lines changed: 0 additions & 3 deletions
This file was deleted.

test/fixtures/react-css-modules/resolves less stylesheets/bar.less

Lines changed: 0 additions & 3 deletions
This file was deleted.

test/fixtures/react-css-modules/resolves less stylesheets/expected.js

Lines changed: 0 additions & 3 deletions
This file was deleted.

test/fixtures/react-css-modules/resolves less stylesheets/options.json

Lines changed: 0 additions & 13 deletions
This file was deleted.

0 commit comments

Comments
 (0)