ModuleOptions

Module output file path. it is used to generate the scoped name. if not provided, options.src will be used

Function to generate scoped name

Generated scope hash length. the default is 5

optional. function change the case of the scoped name and the class mapping

• ModuleCaseTransformEnum.IgnoreCase: do not change case
• ModuleCaseTransformEnum.CamelCase: camelCase ParseResult.mapping key name
• ModuleCaseTransformEnum.CamelCaseOnly: camelCase ParseResult.mapping key name and the scoped class name
• ModuleCaseTransformEnum.DashCase: dashCase ParseResult.mapping key name
• ModuleCaseTransformEnum.DashCaseOnly: dashCase ParseResult.mapping key name and the scoped class name

The pattern used to generate scoped names. the supported placeholders are:

• name: the file base name without the extension
• hash: the file path hash
• local: the local name
• path: the file path
• folder: the folder name
• ext: the file extension

the pattern can optionally have a maximum number of characters:

pattern: '[local:2]-[hash:5]'
Copy

the hash pattern can take an algorithm, a maximum number of characters or both:

pattern: '[local]-[hash:base64:5]'
Copy

or

pattern: '[local]-[hash:5]'
Copy

or

pattern: '[local]-[hash:sha1]'
Copy

supported hash algorithms are:

• base64
• hex
• base64url
• sha1
• sha256
• sha384
• sha512

import {transform, ModuleCaseTransformEnum} from '@tbela99/css-parser';
import type {TransformResult} from '@tbela99/css-parser';
css = `
:local(.className) {
  background: red;
  color: yellow;
}

:local(.subClass) {
  composes: className;
  background: blue;
}
`;

let result: TransformResult = await transform(css, {

    beautify:true,
    module: {
        pattern: '[local]-[hash:sha256]'
    }

});

console.log(result.code);
Copy

generated css

.className-b629f {
 background: red;
 color: #ff0
}
.subClass-a0c35 {
 background: blue
}
Copy

Use local scope vs global scope