Skip to content

preprocessCss option #33

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Sep 10, 2015
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ $ npm i css-modules-require-hook

* `function` **createImportedName** — short alias for the [postcss-modules-extract-imports](https://github.com/css-modules/postcss-modules-extract-imports) plugin's `createImportedName` option.
* `function` **generateScopedName** — short alias for the [postcss-modules-scope](https://github.com/css-modules/postcss-modules-scope) plugin's option. Helps you to specify the custom way to build generic names for the class selectors.
* `function` **preprocessCss** — in rare cases you may want to precompile styles, before they will be passed to the postcss pipeline. You should use **synchronous** transformations, since `require` function is synchronous.
* `function` **processCss** — in rare cases you may want to get compiled styles in runtime, so providing this option helps.
* `string` **rootDir** — absolute path to the project directory. Providing this will result in better generated class names. It can be obligatory, if you run require hook and build tools (like [css-modulesify](https://github.com/css-modules/css-modulesify)) from different working directories.
* `string` **to** — provides `to` option to the [LazyResult instance](https://github.com/postcss/postcss/blob/master/docs/api.md#processorprocesscss-opts).
Expand Down
4 changes: 3 additions & 1 deletion src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import Parser from './parser';
let importNr = 0;
let tokensByFile = {};
// processing functions
const preProcess = identity;
let preProcess = identity;
let postProcess;
// defaults
let lazyResultOpts = {};
Expand All @@ -27,6 +27,7 @@ let rootDir = process.cwd();
* @param {object} opts
* @param {function} opts.createImportedName
* @param {function} opts.generateScopedName
* @param {function} opts.preprocessCss
* @param {function} opts.processCss
* @param {string} opts.rootDir
* @param {string} opts.to
Expand All @@ -37,6 +38,7 @@ export default function setup(opts = {}) {
importNr = 0;
tokensByFile = {};

preProcess = get('preprocessCss', null, 'function', opts) || identity;
postProcess = get('processCss', null, 'function', opts) || null;
rootDir = get('rootDir', ['root', 'd'], 'string', opts) || process.cwd();
// https://github.com/postcss/postcss/blob/master/docs/api.md#processorprocesscss-opts
Expand Down
5 changes: 5 additions & 0 deletions test/plugins.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,11 @@ import LocalByDefault from 'postcss-modules-local-by-default';
import Scope from 'postcss-modules-scope';

describe('plugins', () => {
beforeEach(() => {
// clearing cache
delete require.cache[require.resolve('awesome-theme/oceanic.css')];
});

describe('custom generateScopedName() function', () => {
before(() => hook({generateScopedName: identity}));

Expand Down
30 changes: 30 additions & 0 deletions test/public-api.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import { constant } from 'lodash';
import { equal, ok } from 'assert';
import hook from '../src';

describe('public api', () => {
beforeEach(() => {
// clearing cache
delete require.cache[require.resolve('awesome-theme/oceanic.css')];
});

describe('preprocessCss', () => {
describe('providing empty string constantly', () => {
before(() => hook({preprocessCss: constant('')}));

it('should return an empty result', () => {
const tokens = require('awesome-theme/oceanic.css');
equal(Object.keys(tokens).length, 0);
});
});

describe('providing nothing should reset preProcess', () => {
before(() => hook());

it('should return the "color" token', () => {
const tokens = require('awesome-theme/oceanic.css');
ok(tokens.color);
});
});
});
});