Skip to content

Commit ab28886

Browse files
committed
added a note about options for server side usage
1 parent 2f052e4 commit ab28886

File tree

2 files changed

+15
-9
lines changed

2 files changed

+15
-9
lines changed

README.md

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -48,9 +48,18 @@ b.bundle();
4848
### Options:
4949

5050
- `rootDir`: absolute path to your project's root directory. This is optional but providing it will result in better generated classnames.
51-
- `output`: path to write the generated css
52-
- `json`: optional path to write a json manifest of classnames
53-
- `use`: optional array of postcss plugins (by default we use the css-modules core plugins)
51+
- `output`: path to write the generated css.
52+
- `jsonOutput`: optional path to write a json manifest of classnames.
53+
- `use`: optional array of postcss plugins (by default we use the css-modules core plugins).
54+
55+
## Using CSS Modules on the backend
56+
57+
If you want to use CSS Modules in server-generated templates there are a couple of options:
58+
59+
- Option A (nodejs only): register the [require-hook](https://github.com/css-modules/css-modules-require-hook) so that `var styles = require('./foo.css')` operates the same way as on the frontend. Make sure that the `rootDir` option matches to guarantee that the classnames are the same.
60+
61+
- Option B: configure the `jsonOutput` option with a file path and `css-modulesify` will generate a JSON manifest of classnames.
62+
5463

5564
## PostCSS Plugins
5665

@@ -71,11 +80,8 @@ In addition you may also wish to configure defined PostCSS plugins by passing `-
7180
An example of this would be:
7281

7382
```
74-
browserify -p [css-modulesify -u postcss-modules-local-by-default \
75-
-u postcss-modules-extract-imports \
76-
-u postcss-modules-scope \
77-
-u postcss-color-rebeccapurple \
78-
-u autoprefixer --autoprefixer.browsers '> 5%' \
83+
browserify -p [css-modulesify \
84+
--after autoprefixer --autoprefixer.browsers '> 5%' \
7985
-o dist/main.css] -o dist/index.js src/index.js
8086
```
8187

index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ module.exports = function (browserify, options) {
5050
throw new Error('css-modulesify needs the --output / -o option (path to output css file)');
5151
}
5252

53-
var jsonOutFilename = options.json;
53+
var jsonOutFilename = options.json || options.jsonOutput;
5454

5555
// PostCSS plugins passed to FileSystemLoader
5656
var plugins = options.use || options.u;

0 commit comments

Comments
 (0)