diff --git a/package.json b/package.json index bf7b051..f010f4e 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ "babel-types": "^6.19.0", "generic-names": "^1.0.2", "postcss": "^5.2.6", + "postcss-less": "^0.15.0", "postcss-modules": "^0.5.2", "postcss-modules-extract-imports": "^1.0.1", "postcss-modules-local-by-default": "^1.1.1", diff --git a/src/index.js b/src/index.js index 0d49ae1..b942101 100644 --- a/src/index.js +++ b/src/index.js @@ -61,7 +61,7 @@ export default ({ inherits: babelPluginJsxSyntax, visitor: { ImportDeclaration (path: Object, stats: Object): void { - if (!path.node.source.value.endsWith('.css') && !path.node.source.value.endsWith('.scss')) { + if (!path.node.source.value.endsWith('.css') && !path.node.source.value.endsWith('.scss') && !path.node.source.value.endsWith('.less')) { return; } diff --git a/src/requireCssModule.js b/src/requireCssModule.js index f7cfd86..f8e1e84 100644 --- a/src/requireCssModule.js +++ b/src/requireCssModule.js @@ -15,12 +15,14 @@ import Parser from 'postcss-modules-parser'; import Scope from 'postcss-modules-scope'; import Values from 'postcss-modules-values'; import ScssSyntax from 'postcss-scss'; +import LessSyntax from 'postcss-less'; import type { StyleModuleMapType } from './types'; const getTokens = (runner, cssSourceFilePath: string): StyleModuleMapType => { const sourceFilePathIsScss = cssSourceFilePath.endsWith('.scss'); + const sourceFilePathIsLess = cssSourceFilePath.endsWith('.less'); const options: Object = { from: cssSourceFilePath @@ -30,6 +32,10 @@ const getTokens = (runner, cssSourceFilePath: string): StyleModuleMapType => { options.syntax = ScssSyntax; } + if (sourceFilePathIsLess) { + options.syntax = LessSyntax; + } + const lazyResult = runner .process(readFileSync(cssSourceFilePath, 'utf-8'), options); diff --git a/test/fixtures/react-css-modules/resolves less stylesheets/actual.js b/test/fixtures/react-css-modules/resolves less stylesheets/actual.js new file mode 100644 index 0000000..90aeb49 --- /dev/null +++ b/test/fixtures/react-css-modules/resolves less stylesheets/actual.js @@ -0,0 +1,3 @@ +import './bar.less'; + +
; diff --git a/test/fixtures/react-css-modules/resolves less stylesheets/bar.less b/test/fixtures/react-css-modules/resolves less stylesheets/bar.less new file mode 100644 index 0000000..aedb035 --- /dev/null +++ b/test/fixtures/react-css-modules/resolves less stylesheets/bar.less @@ -0,0 +1,5 @@ +@color: #f00; + +.a { + background-color: @color; +} diff --git a/test/fixtures/react-css-modules/resolves less stylesheets/expected.js b/test/fixtures/react-css-modules/resolves less stylesheets/expected.js new file mode 100644 index 0000000..f87c7c1 --- /dev/null +++ b/test/fixtures/react-css-modules/resolves less stylesheets/expected.js @@ -0,0 +1,3 @@ +import './bar.less'; + +
; diff --git a/test/fixtures/react-css-modules/resolves less stylesheets/options.json b/test/fixtures/react-css-modules/resolves less stylesheets/options.json new file mode 100644 index 0000000..6f54db7 --- /dev/null +++ b/test/fixtures/react-css-modules/resolves less stylesheets/options.json @@ -0,0 +1,10 @@ +{ + "plugins": [ + [ + "../../../../src", + { + "generateScopedName": "[name]__[local]" + } + ] + ] +}