-
Notifications
You must be signed in to change notification settings - Fork 20
Package Options
Nathan Reid edited this page May 18, 2017
·
18 revisions
Package Options are set by creating a cssModules
section in package.json. Here is a sample package.json:
{
"name": "my-app-name",
"version": "1.0.0",
"dependencies": {
"meteor-node-stubs": "^0.2.3"
},
"cssModules": {
"option1": "setting",
"option2": true,
"option3": [ "a", "b" ]
}
}
Here is a list of the supported settings:
Property | Default Value | Available Values | Description |
---|---|---|---|
cssClassNamingConvention | { replacements: [] } |
See cssClassNamingConvention below. | |
jsClassNamingConvention | { camelCase: false } |
See jsClassNamingConvention below. | |
cache | { enableCache: true } |
See cache below. | |
defaultIgnorePath | 'node_modules/.*/\(examples|docs|test|tests\)/' |
A regular expression pattern (as a string or array | This field specifies the default ignore path, which will be combined with the ignorePaths below. The includePaths option takes precedence over this option. |
extensions | ['css', mss', 'm.css'] |
An array of file extensions | Only the extensions included in this setting will be processed by the plugin. |
enableSassCompilation | ['scss', 'sass'] |
An array of file extensions, or false
|
Only the extensions included in this setting will undergo Sass compilation. The extensions must also be included in the extensions property. |
enableStylusCompilation | ['styl', 'm.styl'] |
An array of file extensions, or false
|
Only the extensions included in this setting will undergo Stylus compilation. The extensions must also be included in the extensions property. |
ignorePaths | [] |
An array of regular expression patterns (as strings or arrays) | Files that match any of these patterns will be excluded from processing, for example use the following to exclude the entire node_modules folder: [ 'node_modules' ] . |
includePaths | [] |
An array of regular expression patterns (as strings or arrays) | Files that match any of these patterns will be included in processing, even if they also match an ignorePaths pattern. For example to include the react-toolbox package: [ 'node_modules/react-toolbox' ] . Note that all files are included by default, so if you are not using ignorePaths this option has no effect. |
parser | undefined | The name of your PostCSS parser, if any. | The value of this option will be require() d and passed to PostCSS. For more details, see [[Sugarss and other PostCSS parsers |
passthroughPaths | [] |
An array of regular expression patterns (as strings) | Files that match any of these patterns will be passed through unchanged, for example use the following to exclude bootstrap from processing anywhere in the project: [ 'bootstrap.css' ] . |
specificArchitecture | 'web' |
Any valid archMatching string, or false
|
Allows filtering the plugin to run on a specific architecture. By default the plugin runs on 'web' (client-side) only; to enable server-side processing as well, set the value to false . To enable server-side and disable client-side processing, set the value to 'os' . |
Property | Default Value | Available Values | Description |
---|---|---|---|
replacements | [] |
An array of regular expression patterns (as strings) OR an array of regex replacement arrays | Text that matches these replacements will be replaced by the replacement text (or removed if there is no replacement text specified). Example: "test", [ "a", "b"], ["a", "g", "_"] ] will remove the first occurrence of test, replace the first occurrence of "a" with "b", and replace all other occurrences of "a" with "_". |
template | undefined |
An es6 template string | This field allows you to customize the generated class names (e.g. the .hello class in /imports/foo.css becomes _imports__foo__hello . See the Custom CSS Class Names page for more info. |
Property | Default Value | Available Values | Description |
---|---|---|---|
camelCase | false |
true or false
|
If true the JS properties that refer to class names will be camel cased using the camelcase npm package. For example, the css class .blue-sky will be available in javascript as the property styles.blueSky . |
Property | Default Value | Available Values | Description |
---|---|---|---|
enableCache | true |
true or false
|
Set to false to disable caching |
An array of one to 3 elements like so: [pattern]
or [pattern, replacementText]
or [pattern, regexOptions, replacementText]
.
Replacement text defaults to ''.