@adamlui/scss-to-css 1.11.1 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +33 -35
- package/dist/cli.min.js +26 -25
- package/dist/scss-to-css.min.js +10 -10
- package/docs/README.md +33 -35
- package/package.json +5 -5
package/README.md
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
<a id="top"></a>
|
|
2
|
+
|
|
1
3
|
<table align="center">
|
|
2
4
|
<td align="center" width=1000>
|
|
3
5
|
<h6>
|
|
@@ -30,15 +32,15 @@
|
|
|
30
32
|
<a href="https://www.npmjs.com/package/@adamlui/scss-to-css">
|
|
31
33
|
<img height=31 src="https://img.shields.io/npm/dm/%40adamlui%2Fscss-to-css?logo=npm&color=af68ff&logoColor=white&labelColor=464646&style=for-the-badge"></a>
|
|
32
34
|
<a href="#%EF%B8%8F-mit-license">
|
|
33
|
-
<img height=31 src="https://img.shields.io/badge/License-MIT-
|
|
34
|
-
<a href="https://github.com/adamlui/js-utils/releases/tag/scss-to-css-
|
|
35
|
-
<img height=31 src="https://img.shields.io/badge/Latest_Build-
|
|
35
|
+
<img height=31 src="https://img.shields.io/badge/License-MIT-orange.svg?logo=internetarchive&logoColor=white&labelColor=464646&style=for-the-badge"></a>
|
|
36
|
+
<a href="https://github.com/adamlui/js-utils/releases/tag/scss-to-css-2.0.0">
|
|
37
|
+
<img height=31 src="https://img.shields.io/badge/Latest_Build-2.0.0-44cc11.svg?logo=icinga&logoColor=white&labelColor=464646&style=for-the-badge"></a>
|
|
36
38
|
<a href="https://www.npmjs.com/package/@adamlui/scss-to-css?activeTab=code">
|
|
37
39
|
<img height=31 src="https://img.shields.io/npm/unpacked-size/%40adamlui%2Fscss-to-css?style=for-the-badge&logo=ebox&logoColor=white&color=blue&labelColor=464646"></a>
|
|
38
40
|
<a href="https://sonarcloud.io/component_measures?metric=new_vulnerabilities&id=adamlui_scss-to-css:node.js/src/scss-to-css.js">
|
|
39
41
|
<img height=31 src="https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fsonarcloud.io%2Fapi%2Fmeasures%2Fcomponent%3Fcomponent%3Dadamlui_scss-to-css%3Anode.js%2Fsrc%2Fscss-to-css.js%26metricKeys%3Dvulnerabilities&query=%24.component.measures.0.value&style=for-the-badge&logo=sonarcloud&logoColor=white&labelColor=464646&label=Vulnerabilities&color=gold"></a>
|
|
40
42
|
<a href="https://github.com/toolleeo/cli-apps#conversion">
|
|
41
|
-
<img height=31 src="https://img.shields.io/badge/Mentioned_in-Awesome-
|
|
43
|
+
<img height=31 src="https://img.shields.io/badge/Mentioned_in-Awesome-ff69b4?logo=awesomelists&logoColor=white&labelColor=464646&style=for-the-badge"></a>
|
|
42
44
|
|
|
43
45
|
<img height=6px width="100%" src="https://assets.scsstocss.org/images/separators/aqua-gradient.png?v=7e4a141">
|
|
44
46
|
|
|
@@ -91,7 +93,7 @@ $ scss-to-css [input_path] [output_path]
|
|
|
91
93
|
```
|
|
92
94
|
|
|
93
95
|
- `[input_path]`: Path to SCSS file or directory containing SCSS files to be compiled, relative to the current working directory.
|
|
94
|
-
- `[output_path]`: Path to file or directory where CSS + source map files will be stored, relative to
|
|
96
|
+
- `[output_path]`: Path to file or directory where CSS + source map files will be stored, relative to input root (if not provided, `css/` is used).
|
|
95
97
|
|
|
96
98
|
**📝 Note:** If folders are passed, files will be processed recursively unless `-R` or `--no-recursion` is passed.
|
|
97
99
|
|
|
@@ -117,13 +119,13 @@ Compile all SCSS files in the **current directory** (outputs to `css/`):
|
|
|
117
119
|
$ scss-to-css
|
|
118
120
|
```
|
|
119
121
|
|
|
120
|
-
Compile all SCSS files in a **specific directory** (outputs to `path/to/your/directory
|
|
122
|
+
Compile all SCSS files in a **specific directory** (outputs to `css/path/to/your/directory/`):
|
|
121
123
|
|
|
122
124
|
```
|
|
123
125
|
$ scss-to-css path/to/your/directory
|
|
124
126
|
```
|
|
125
127
|
|
|
126
|
-
Compile a **specific file** (outputs to `path/to/your/
|
|
128
|
+
Compile a **specific file** (outputs to `css/path/to/your/file.min.css`):
|
|
127
129
|
|
|
128
130
|
```
|
|
129
131
|
$ scss-to-css path/to/your/file.scss
|
|
@@ -149,13 +151,14 @@ Boolean options:
|
|
|
149
151
|
-S, --no-source-maps Prevent source maps from being generated.
|
|
150
152
|
-M, --no-minify Disable minification of output CSS.
|
|
151
153
|
-R, --no-recursion Disable recursive file searching.
|
|
154
|
+
-r, --relative-output Output files relative to each source file instead of to input root.
|
|
152
155
|
-c, --copy Copy compiled CSS to clipboard instead of
|
|
153
156
|
writing to file if single source file is
|
|
154
157
|
processed.
|
|
155
158
|
-q, --quiet Suppress all logging except errors.
|
|
156
159
|
|
|
157
160
|
Parameter options:
|
|
158
|
-
--
|
|
161
|
+
--ignores="dir/,file1.scss,file2.scss" Files/directories to exclude from
|
|
159
162
|
compilation.
|
|
160
163
|
--comment="comment" Prepend header comment to
|
|
161
164
|
compiled CSS. Separate by
|
|
@@ -182,7 +185,7 @@ import scssToCSS from '@adamlui/scss-to-css';
|
|
|
182
185
|
#### CJS:
|
|
183
186
|
|
|
184
187
|
```js
|
|
185
|
-
const scssToCSS = require('@adamlui/scss-to-css')
|
|
188
|
+
const scssToCSS = require('@adamlui/scss-to-css')
|
|
186
189
|
```
|
|
187
190
|
|
|
188
191
|
###### _*Node.js version 14 or higher required_
|
|
@@ -197,10 +200,10 @@ If **source code** is passed, it is directly compiled, then an object containing
|
|
|
197
200
|
|
|
198
201
|
```js
|
|
199
202
|
const srcCode = 'h1 { font-size: 40px ; code { font-face: Roboto Mono }}',
|
|
200
|
-
compileResult = scssToCSS.compile(srcCode)
|
|
203
|
+
compileResult = scssToCSS.compile(srcCode)
|
|
201
204
|
|
|
202
|
-
console.log(compileResult.error)
|
|
203
|
-
console.log(compileResult.code)
|
|
205
|
+
console.log(compileResult.error) // outputs runtime error, or `undefined` if no error
|
|
206
|
+
console.log(compileResult.code) // outputs minified CSS: 'h1{font-size:40px}h1 code{font-face:Roboto Mono}'
|
|
204
207
|
```
|
|
205
208
|
|
|
206
209
|
If a **file path** is passed, the file's code is loaded then compiled to CSS, returning an object like above.
|
|
@@ -209,31 +212,32 @@ If a **directory path** is passed, SCSS files are searched for (recursively by d
|
|
|
209
212
|
|
|
210
213
|
```js
|
|
211
214
|
// Outputs paths to SCSS files in working directory + all nested directories
|
|
212
|
-
const compileResults = scssToCSS.compile('.')
|
|
213
|
-
compileResults.forEach(result => console.log(result.srcPath))
|
|
215
|
+
const compileResults = scssToCSS.compile('.')
|
|
216
|
+
compileResults.forEach(result => console.log(result.srcPath))
|
|
214
217
|
|
|
215
218
|
// Outputs compiled CSS from 2nd SCSS file if found, or `undefined` if not found
|
|
216
|
-
console.log(compileResults[1].code)
|
|
219
|
+
console.log(compileResults[1].code)
|
|
217
220
|
```
|
|
218
221
|
|
|
219
222
|
Options are boolean, passed as object properties. For example:
|
|
220
223
|
|
|
221
224
|
```js
|
|
222
225
|
// Returns array of data objects where `.code` contains unminified CSS
|
|
223
|
-
scssToCSS.compile(inputDir, { minify: false })
|
|
226
|
+
scssToCSS.compile(inputDir, { minify: false })
|
|
224
227
|
```
|
|
225
228
|
|
|
226
229
|
Available parameters (and their default settings) are:
|
|
227
230
|
|
|
228
|
-
Name
|
|
229
|
-
|
|
230
|
-
`recursive`
|
|
231
|
-
`verbose`
|
|
232
|
-
`dotFolders`
|
|
233
|
-
`minify`
|
|
234
|
-
`sourceMaps`
|
|
235
|
-
`
|
|
236
|
-
`
|
|
231
|
+
Name | Type | Desciption | Default value
|
|
232
|
+
-----------------|---------|-------------------------------------------------------------------------|---------------
|
|
233
|
+
`recursive` | Boolean | Recursively search for nested files if dir path passed. | `true`
|
|
234
|
+
`verbose` | Boolean | Show logging in console/terminal. | `true`
|
|
235
|
+
`dotFolders` | Boolean | Include dotfolders in file search. | `false`
|
|
236
|
+
`minify` | Boolean | Minify output CSS. | `true`
|
|
237
|
+
`sourceMaps` | Boolean | Generate CSS source maps. | `true`
|
|
238
|
+
`relativeOutput` | Boolean | Output files relative to each source file instead of to input root. | `false`
|
|
239
|
+
`ignores` | Array | Files/dirs to exclude from compilation. | `[]`
|
|
240
|
+
`comment` | String | Header comment to prepend to compiled CSS. Separate by line using '\n'. | `''`
|
|
237
241
|
|
|
238
242
|
#
|
|
239
243
|
|
|
@@ -245,8 +249,8 @@ Options are boolean, passed as object properties. For example:
|
|
|
245
249
|
|
|
246
250
|
```js
|
|
247
251
|
// Search for SCSS files in exactly assets/scss
|
|
248
|
-
const searchResults = scssToCSS.findSCSS('assets/scss', { recursive: false })
|
|
249
|
-
console.log(searchResults)
|
|
252
|
+
const searchResults = scssToCSS.findSCSS('assets/scss', { recursive: false })
|
|
253
|
+
console.log(searchResults)
|
|
250
254
|
|
|
251
255
|
/* sample output:
|
|
252
256
|
|
|
@@ -267,7 +271,7 @@ Name | Type | Desciption
|
|
|
267
271
|
`recursive` | Boolean | Recursively search for nested files in searchDir passed. | `true`
|
|
268
272
|
`verbose` | Boolean | Show logging in console/terminal. | `true`
|
|
269
273
|
`dotFolders` | Boolean | Include dotfolders in file search. | `false`
|
|
270
|
-
`
|
|
274
|
+
`ignores` | Array | Files/dirs to exclude from search results. | `[]`
|
|
271
275
|
|
|
272
276
|
<br>
|
|
273
277
|
|
|
@@ -289,12 +293,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
|
|
|
289
293
|
|
|
290
294
|
## 🛠️ Related utilities
|
|
291
295
|
|
|
292
|
-
### [🖼️ img-to-webp](https://github.com/adamlui/js-utils/tree/main/img-to-webp)
|
|
293
|
-
|
|
294
|
-
> Recursively compress all images to WEBPs.
|
|
295
|
-
<br>[Download](https://cdn.jsdelivr.net/gh/adamlui/js-utils/img-to-webp/img-to-webp.js) /
|
|
296
|
-
[Discuss](https://github.com/adamlui/js-utils/discussions)
|
|
297
|
-
|
|
298
296
|
### [</> minify.js](https://minify-js.org) <a href="https://github.com/toolleeo/cli-apps#programming"><img height=18 src="https://assets.scsstocss.org/images/badges/awesome/badge.svg?v=7e4a141"></a>
|
|
299
297
|
|
|
300
298
|
> Recursively minify all JavaScript files.
|
|
@@ -310,4 +308,4 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
|
|
|
310
308
|
|
|
311
309
|
<picture><source media="(prefers-color-scheme: dark)" srcset="https://assets.scsstocss.org/images/icons/home/white/icon32x27.png?v=7e4a141"><img height=13 src="https://assets.scsstocss.org/images/icons/home/dark-gray/icon32x27.png?v=7e4a141"></picture> <a href="https://js-utils.org">**More JavaScript utilities**</a> /
|
|
312
310
|
<a href="https://github.com/adamlui/scss-to-css/discussions">Discuss</a> /
|
|
313
|
-
<a href="
|
|
311
|
+
<a href="#top">Back to top ↑</a>
|
package/dist/cli.min.js
CHANGED
|
@@ -1,30 +1,31 @@
|
|
|
1
1
|
#!/usr/bin/env node
|
|
2
2
|
/**
|
|
3
3
|
* © 2024 Adam Lui & contributors under the MIT license.
|
|
4
|
-
* Source: https://
|
|
5
|
-
* Documentation: https://
|
|
4
|
+
* Source: https://github.com/adamlui/scss-to-css/tree/main/node.js/src
|
|
5
|
+
* Documentation: https://github.com/adamlui/scss-to-css/tree/main/node.js/docs
|
|
6
6
|
*/
|
|
7
|
-
(()=>{let i="@adamlui/scss-to-css",r="https://
|
|
8
|
-
${
|
|
9
|
-
${
|
|
10
|
-
${
|
|
11
|
-
Global version: `+
|
|
12
|
-
${
|
|
13
|
-
'${
|
|
14
|
-
${
|
|
15
|
-
» scss-to-css . output.min.css[0m`),
|
|
16
|
-
${
|
|
17
|
-
No SCSS files will be compiled.[0m`);else{let o=[]
|
|
18
|
-
${
|
|
19
|
-
${
|
|
20
|
-
`+
|
|
21
|
-
|
|
22
|
-
Writing to file${1<
|
|
23
|
-
├
|
|
24
|
-
${f}o Usage:[0m`,` ${f}»
|
|
25
|
-
${f}o Path arguments:[0m`," [inputPath] Path to SCSS file or directory containing SCSS files to be compiled, relative to the current working directory."," [outputPath] Path to file or directory where CSS + sourcemap files will be stored, relative to
|
|
26
|
-
${f}o Boolean options:[0m`," -n, --dry-run Don't actually compile the file(s), just show if they will be processed."," -d, --include-dotfolders Include dotfolders in file search."," -S, --no-source-maps Prevent source maps from being generated."," -M, --no-minify Disable minification of output CSS."," -R, --no-recursion Disable recursive file searching."," -c, --copy Copy compiled CSS to clipboard instead of writing to file if single source file is processed."," -q, --quiet Suppress all logging except errors."],paramOptions:[`
|
|
27
|
-
${f}o Parameter options:[0m`,'--
|
|
28
|
-
${f}o Info commands:[0m`," -h, --help Display help screen."," -v, --version Show version number."]};e.forEach(
|
|
7
|
+
(()=>{let i="@adamlui/scss-to-css",r="https://github.com/adamlui/scss-to-css/tree/main/node.js/#-command-line-usage",t=require(__dirname.match(/src/)?"./scss-to-css":"./scss-to-css.min"),l=require("fs"),m=require("path"),n=require("node-clipboardy"),o=require("child_process").execSync,p="[1;91m",d="[1;33m",u="[1;92m",f="[1;97m",h={},c={flags:{dryRun:/^--?(?:n|dry-?run)$/,includeDotFolders:/^--?(?:dd?|(?:include-?)?dot-?(?:folder|dir(?:ector(?:y|ie))?)s?=?(?:true|1)?)$/,noSourceMaps:/^--?(?:S|(?:exclude|disable|no)-?so?u?rce?-?maps?|so?u?rce?-?maps?=(?:false|0))$/,noRecursion:/^--?(?:R|(?:disable|no)-?recursi(?:on|ve)|recursi(?:on|ve)=(?:false|0))$/,noMinify:/^--?(?:M|(?:disable|no)-?minif(?:y|ication)|minif(?:y|ication)=(?:false|0))$/,relativeOutput:/^--?(?:r|relative-?output?=?(?:true|1)?)$/,copy:/^--?c(?:opy)?$/,quietMode:/^--?q(?:uiet)?(?:-?mode)?$/},paramOptions:{ignores:/^--?(?:ignores?|(?:ignore|skip|exclude)(?:d?-?files?)?)(?:=.*|$)/,comment:/^--?comments?(?:=.*|$)/},infoCmds:{help:/^--?h(?:elp)?$/,version:/^--?ve?r?s?i?o?n?$/}};if(process.argv.forEach(s=>{var e,o,i;s.startsWith("-")&&(i=Object.keys(c.flags).find(e=>c.flags[e].test(s)),e=Object.keys(c.paramOptions).find(e=>c.paramOptions[e].test(s)),o=Object.keys(c.infoCmds).find(e=>c.infoCmds[e].test(s)),i?h[i]=!0:e?(/=.+/.test(s)||(console.error(`
|
|
8
|
+
${p}ERROR: Arg [--${s.replace(/-/g,"")}] requires '=' followed by a value.[0m`),y(),process.exit(1)),i=s.split("=")[1],h[e]=parseInt(i)||i):o||(console.error(`
|
|
9
|
+
${p}ERROR: Arg [${s}] not recognized.[0m`),console.info(`
|
|
10
|
+
${d}Valid arguments are below.[0m`),v(["flags","paramOptions","infoCmds"]),process.exit(1)))}),process.argv.some(e=>c.infoCmds.help.test(e)))v();else if(process.argv.some(e=>c.infoCmds.version.test(e))){var g=o(`npm view ${i} version`).toString().trim()||"none";let e,s=process.cwd();for(;"/"!=s;){var a=m.join(s,"package.json");if(l.existsSync(a)){a=require(a);e=(a.dependencies?.[i]||a.devDependencies?.[i])?.match(/^[~^>=]?\d+\.\d+\.\d+$/)[1]||"none";break}s=m.dirname(s)}console.info(`
|
|
11
|
+
Global version: `+g),console.info("Local version: "+e)}else{let[c="",a=""]=process.argv.slice(2).filter(e=>!e.startsWith("-")).map(e=>e.replace(/^\/*/,"")),s=m.resolve(process.cwd(),c);c&&!l.existsSync(s)&&(g=s+".scss",l.existsSync(g)?s=g:(console.error(`
|
|
12
|
+
${p}Error: First argument can only be an existing file or directory.`+`
|
|
13
|
+
'${s}' does not exist.[0m`),console.info(`
|
|
14
|
+
${u}Example valid command:
|
|
15
|
+
» scss-to-css . output.min.css[0m`),y(),process.exit(1)));var S,g=s.endsWith(".scss")&&!l.statSync(s).isDirectory()?[s]:t.findSCSS(s,{recursive:!h.noRecursion,verbose:!h.quietMode,ignores:(h.ignores?.split(",")??[]).map(e=>e.trim())});if(h.dryRun)g.length?(console.info(`
|
|
16
|
+
${d}SCSS files to be compiled:[0m`),g.forEach(e=>console.info(e))):console.info(d+`
|
|
17
|
+
No SCSS files will be compiled.[0m`);else{let o=[],e=[];!h.relativeOutput&&l.statSync(s).isDirectory()?(S=t.compile(s,{verbose:!h.quietMode,minify:!h.noMinify,comment:h.comment?.replace(/\\n/g,"\n"),relativeOutput:!1,recursive:!h.noRecursion,dotFolders:!!h.includeDotFolders,sourceMaps:!h.noSourceMaps,ignores:h.ignores?h.ignores.split(",").map(e=>e.trim()):[]}),Array.isArray(S)&&(e=S),S&&(S.error?o.push(s):e=[].concat(S))):e=g.map(e=>{var s=t.compile(e,{verbose:!h.quietMode,minify:!h.noMinify,sourceMaps:!h.noSourceMaps,comment:h.comment?.replace(/\\n/g,"\n")});return s.error&&o.push(e),s}).filter(e=>!e.error),e?.length?(S=1<e.length?"s":"",$(`
|
|
18
|
+
${u}Compilation complete![0m`),$(f+e.length+" CSS file"+S+(h.noSourceMaps?"":` + ${e.length} source map`+S)+" generated.[0m")):$(`
|
|
19
|
+
${d}No SCSS files processed.[0m`),o.length&&($(`
|
|
20
|
+
`+p+o.length+" file"+(1<o.length?"s":"")+" failed to compile:[0m"),o.forEach(e=>$(e))),0==e?.length&&process.exit(0),h.copy&&1==e?.length?(console.log(`
|
|
21
|
+
${f}${e[0].code}[0m`),$("\nCopying to clipboard..."),n.writeSync(e[0].code)):($(`
|
|
22
|
+
Writing to file${1<e?.length?"s":""}...`),e?.forEach(({code:e,srcMap:s,srcPath:o,relPath:i})=>{let r,t;if(!h.relativeOutput&&i){let e=m.resolve(process.cwd(),a||"css"),s=m.dirname(i);r="."!=s?m.join(e,s):e,t=m.basename(o,".scss")+`${h.noMinify?"":".min"}.css`}else r=m.join(m.dirname(o),a.endsWith(".css")?m.dirname(a):a||"css"),t=(a.endsWith(".css")&&c.endsWith(".scss")?m.basename(a).replace(/(\.min)?\.css$/,""):m.basename(o,".scss"))+".min.css";let n=m.join(r,t);l.existsSync(r)||l.mkdirSync(r,{recursive:!0}),l.writeFileSync(n,e,"utf8"),$(` ${u}✓[0m `+m.relative(process.cwd(),n)),h.noSourceMaps||l.writeFileSync(n+".map",JSON.stringify(s),"utf8"),$(` ${u}✓[0m `+m.relative(process.cwd(),n))}))}}function v(e=["header","usage","pathArgs","flags","paramOptions","infoCmds"]){var s=`[106m[30m ${i.replace(/^@[^/]+\//,"")} [0m `;let o={header:[`
|
|
23
|
+
├ ${s}© 2024–2026 Adam Lui & contributors under the MIT license.`,s+"Source: https://github.com/adamlui/scss-to-css/tree/main/node.js/src"],usage:[`
|
|
24
|
+
${f}o Usage:[0m`,` ${f}» ${u}scss-to-css [inputPath] [outputPath] [options][0m`],pathArgs:[`
|
|
25
|
+
${f}o Path arguments:[0m`," [inputPath] Path to SCSS file or directory containing SCSS files to be compiled, relative to the current working directory."," [outputPath] Path to file or directory where CSS + sourcemap files will be stored, relative to input root (if not provided, css/ is used)."],flags:[`
|
|
26
|
+
${f}o Boolean options:[0m`," -n, --dry-run Don't actually compile the file(s), just show if they will be processed."," -d, --include-dotfolders Include dotfolders in file search."," -S, --no-source-maps Prevent source maps from being generated."," -M, --no-minify Disable minification of output CSS."," -R, --no-recursion Disable recursive file searching."," -r, --relative-output Output files relative to each source file instead of to input root."," -c, --copy Copy compiled CSS to clipboard instead of writing to file if single source file is processed."," -q, --quiet Suppress all logging except errors."],paramOptions:[`
|
|
27
|
+
${f}o Parameter options:[0m`,'--ignores="dir/,file1.scss,file2.scss" Files/directories to exclude from compilation.',"--comment=\"comment\" Prepend header comment to compiled CSS. Separate by line using '\\n'."],infoCmds:[`
|
|
28
|
+
${f}o Info commands:[0m`," -h, --help Display help screen."," -v, --version Show version number."]};e.forEach(n=>o[n]?.forEach(s=>{{var t=/header|usage/.test(n)?1:41;let o=process.stdout.columns||80,i=[],e=s.match(/\S+|\s+/g),r="";e.forEach(e=>{var s=o-(i.length?t:0);r.length+"| ".length+e.length>s&&(i.push(i.length?r.trimStart():r),r=""),r+=e}),i.push(i.length?r.trimStart():r),i.forEach((e,s)=>console.info("| "+(0==s?e:" ".repeat(t)+e)))}})),console.info(`
|
|
29
|
+
For more help, please visit: ${f}${r}[0m`)}function y(){console.info(`
|
|
29
30
|
For more help, type 'scss-to-css --help' or visit
|
|
30
|
-
|
|
31
|
+
${f}${r}[0m`)}function $(e){h.quietMode||console.info(e)}})();
|
package/dist/scss-to-css.min.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
let fs=require("fs"),path=require("path"),sass=require("sass");function findSCSS(r,i={}){
|
|
2
|
-
|
|
3
|
-
`),{code:void 0,srcMap:void 0,srcPath:void 0,error:e}}}).filter(e=>!e.error),
|
|
4
|
-
|
|
5
|
-
`),{code:void 0,srcMap:void 0,srcPath:void 0,error:e}}}else{
|
|
6
|
-
|
|
7
|
-
`),{code:void 0,srcMap:void 0,srcPath:void 0,error:e}}}function
|
|
1
|
+
let fs=require("fs"),path=require("path"),sass=require("sass");function findSCSS(r,i={}){let e="https://github.com/adamlui/scss-to-css/tree/main/node.js/#findscsssearchdir-options",n="findSCSS() » ";var o={recursive:!0,verbose:!0,dotFolders:!1,ignores:[]};if("string"!=typeof r)console.error(n+"ERROR: 1st arg <searchDir> must be a string."),console.info(n+"For more help, please visit "+e);else{var s=path.resolve(process.cwd(),r);if(fs.existsSync(s)){if(validateOptions(i,o,e,"findSCSS('assets/scss', { verbose: false, dotFolders: true })")){(i={...o,...i}).ignoreFiles&&(i.ignores=[...i.ignores??[],...i.ignoreFiles]);let e=fs.readdirSync(r),s=[];return i.verbose&&!i.isRecursing&&console.info(n+"Searching for SCSS files..."),e.forEach(e=>{let o=path.resolve(r,e);i.ignores.some(s=>s.endsWith("/")?o.split(path.sep).some(e=>e==s.replace(/\/$/,"")):e==s)?i.verbose&&console.info(n+`** ${e} ignored`):fs.statSync(o).isDirectory()&&"node_modules"!=e&&i.recursive&&(i.dotFolders||!e.startsWith("."))?s.push(...findSCSS(o,{...i,isRecursing:!0})):e.endsWith(".scss")&&s.push(o)}),i.verbose&&!i.isRecursing&&(console.info(n+"Search complete! "+`${s.length||"No"} file${1==s.length?"":"s"} found.`),"compile"!=findSCSS.caller?.name)&&"undefined"!=typeof window&&console.info(n+"Check returned array."),i.isRecursing||s.length?s:[]}}else console.error(n+"ERROR: 1st arg <searchDir> must be an existing directory."),console.error(n+s+" does not exist."),console.info(n+"For more help, please visit "+e)}}function compile(i,n={}){let e="https://github.com/adamlui/scss-to-css/tree/main/node.js/#compileinput-options",t="compile() » ";var s={recursive:!0,verbose:!0,dotFolders:!1,minify:!0,sourceMaps:!0,relativeOutput:!1,ignores:[],comment:""};if("string"!=typeof i)console.error(t+"ERROR: 1st arg <input> must be a string."),console.info(t+"For more help, please visit "+e);else if(validateOptions(n,s,e,"compile('assets/scss', { recursive: false, minify: false })")){(n={...s,...n}).ignoreFiles&&(n.ignores=[...n.ignores??[],...n.ignoreFiles]);let r={style:n.minify?"compressed":"expanded",sourceMap:n.sourceMaps,charset:!1};if(fs.existsSync(i)){if(!i.endsWith(".scss")||!fs.statSync(i).isFile())return s=findSCSS(i,n)?.map(s=>{n.verbose&&console.info(t+`** Compiling ${s}...`);try{var o=sass.compile(s,r);let e;return n.relativeOutput||(e=path.relative(path.resolve(process.cwd(),i),s)),n.comment&&(o.css=l(o.css,n.comment)),{code:o.css,srcMap:o.sourceMap,srcPath:s,relPath:e,error:void 0}}catch(e){return console.error(`
|
|
2
|
+
${t}ERROR: ${e.message}
|
|
3
|
+
`),{code:void 0,srcMap:void 0,srcPath:void 0,error:e}}}).filter(e=>!e.error),n.verbose&&(s.length&&"undefined"!=typeof window?console.info(t+"Compilation complete! Check returned object."):console.info(t+"No SCSS files processed.")),s;n.verbose&&console.info(t+`** Compiling ${i}...`);try{var o=sass.compile(i,r);return n.comment&&(o.css=l(o.css,n.comment)),n.verbose&&"undefined"!=typeof window&&console.info(t+"Compilation complete! Check returned object."),{code:o.css,srcMap:o.sourceMap,srcPath:path.resolve(process.cwd(),i),error:void 0}}catch(e){return console.error(`
|
|
4
|
+
${t}ERROR: ${e.message}
|
|
5
|
+
`),{code:void 0,srcMap:void 0,srcPath:void 0,error:e}}}else{n.verbose&&console.info(t+"** Compiling passed source code...");try{var c=sass.compileString(i,r);return n.comment&&(c.css=l(c.css,n.comment)),{code:c.css,srcMap:c.sourceMap,srcPath:void 0,error:void 0}}catch(e){return console.error(`
|
|
6
|
+
${t}ERROR: ${e.message}
|
|
7
|
+
`),{code:void 0,srcMap:void 0,srcPath:void 0,error:e}}}function l(e,s){var s=s.split("\n").map(e=>" * "+e).join("\n"),o=e.indexOf("#!");return 0<=o?(o=e.indexOf("\n",o)+1,e.slice(0,o)+`/**
|
|
8
8
|
/**
|
|
9
9
|
* © 2024 Adam Lui & contributors under the MIT license.
|
|
10
|
-
* Source: https://
|
|
11
|
-
* Documentation: https://
|
|
10
|
+
* Source: https://github.com/adamlui/scss-to-css/tree/main/node.js/src
|
|
11
|
+
* Documentation: https://github.com/adamlui/scss-to-css/tree/main/node.js/docs
|
|
12
12
|
*/
|
|
13
13
|
${s}
|
|
14
14
|
*/
|
|
15
15
|
`+e.slice(o)):`/**
|
|
16
16
|
${s}
|
|
17
17
|
*/
|
|
18
|
-
`+e}}}function validateOptions(e,s,o,r){let i=JSON.stringify(s,void 0,2).replace(/"([^"]+)":/g,"$1:").replace(/"/g,"'").replace(/\n\s*/g," "),n=Object.keys(s).join(", "),
|
|
18
|
+
`+e}}}function validateOptions(e,s,o,r){let i=JSON.stringify(s,void 0,2).replace(/"([^"]+)":/g,"$1:").replace(/"/g,"'").replace(/\n\s*/g," "),n=Object.keys(s).join(", "),t=Object.keys(s).filter(e=>"boolean"==typeof s[e]),c=Object.keys(s).filter(e=>Number.isInteger(s[e])),l=Object.keys(s).filter(e=>Array.isArray(s[e])),a=`${validateOptions.caller?.name||"validateOptions"}() » `;var d,p=r.split(",").findIndex(e=>e.trim().startsWith("{"))+1;function f(){console.info(a+"For more help, please visit "+o)}if(p+=["st","nd","rd"][p-1]||"th","object"!=typeof e)return console.error(a+`ERROR: ${"0th"==p?"[O":p+" arg [o"}ptions] can only be an object of key/values.`),console.info(a+"Example valid call: "+r),console.info(a+`Valid options: [ ${n} ]`),console.info(a+"If omitted, default settings are: "+i),f(),!1;for(d in e)if("isRecursing"==d||Object.prototype.hasOwnProperty.call(s,d)){if(t.includes(d)&&"boolean"!=typeof e[d])return console.error(a+`ERROR: [${d}] option can only be \`true\` or \`false\`.`),f(),!1;if(c.includes(d)){if(e[d]=parseInt(e[d],10),isNaN(e[d])||e[d]<1)return console.error(a+`ERROR: [${d}] option can only be an integer > 0.`),f(),!1}else if(l.includes(d))if("string"!=typeof e[d]||e[d].includes(",")){if(!Array.isArray(e[d]))return console.error(a+`ERROR: [${d}] option can only be an array.`),f(),!1}else e[d]=[e[d]]}return!0}let stcAliases={compile:["build","Build","Compile","compress","Compress","minify","Minify"],findSCSS:["find","Find","findscss","findScss","Findscss","FindScss","FindSCSS","search","Search"]};module.exports={compile:compile,findSCSS:findSCSS};for(let s in stcAliases)stcAliases[s].forEach(e=>module.exports[e]=module.exports[s]);
|
package/docs/README.md
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
<a id="top"></a>
|
|
2
|
+
|
|
1
3
|
<table align="center">
|
|
2
4
|
<td align="center" width=1000>
|
|
3
5
|
<h6>
|
|
@@ -30,15 +32,15 @@
|
|
|
30
32
|
<a href="https://www.npmjs.com/package/@adamlui/scss-to-css">
|
|
31
33
|
<img height=31 src="https://img.shields.io/npm/dm/%40adamlui%2Fscss-to-css?logo=npm&color=af68ff&logoColor=white&labelColor=464646&style=for-the-badge"></a>
|
|
32
34
|
<a href="#%EF%B8%8F-mit-license">
|
|
33
|
-
<img height=31 src="https://img.shields.io/badge/License-MIT-
|
|
34
|
-
<a href="https://github.com/adamlui/js-utils/releases/tag/scss-to-css-
|
|
35
|
-
<img height=31 src="https://img.shields.io/badge/Latest_Build-
|
|
35
|
+
<img height=31 src="https://img.shields.io/badge/License-MIT-orange.svg?logo=internetarchive&logoColor=white&labelColor=464646&style=for-the-badge"></a>
|
|
36
|
+
<a href="https://github.com/adamlui/js-utils/releases/tag/scss-to-css-2.0.0">
|
|
37
|
+
<img height=31 src="https://img.shields.io/badge/Latest_Build-2.0.0-44cc11.svg?logo=icinga&logoColor=white&labelColor=464646&style=for-the-badge"></a>
|
|
36
38
|
<a href="https://www.npmjs.com/package/@adamlui/scss-to-css?activeTab=code">
|
|
37
39
|
<img height=31 src="https://img.shields.io/npm/unpacked-size/%40adamlui%2Fscss-to-css?style=for-the-badge&logo=ebox&logoColor=white&color=blue&labelColor=464646"></a>
|
|
38
40
|
<a href="https://sonarcloud.io/component_measures?metric=new_vulnerabilities&id=adamlui_scss-to-css:node.js/src/scss-to-css.js">
|
|
39
41
|
<img height=31 src="https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fsonarcloud.io%2Fapi%2Fmeasures%2Fcomponent%3Fcomponent%3Dadamlui_scss-to-css%3Anode.js%2Fsrc%2Fscss-to-css.js%26metricKeys%3Dvulnerabilities&query=%24.component.measures.0.value&style=for-the-badge&logo=sonarcloud&logoColor=white&labelColor=464646&label=Vulnerabilities&color=gold"></a>
|
|
40
42
|
<a href="https://github.com/toolleeo/cli-apps#conversion">
|
|
41
|
-
<img height=31 src="https://img.shields.io/badge/Mentioned_in-Awesome-
|
|
43
|
+
<img height=31 src="https://img.shields.io/badge/Mentioned_in-Awesome-ff69b4?logo=awesomelists&logoColor=white&labelColor=464646&style=for-the-badge"></a>
|
|
42
44
|
|
|
43
45
|
<img height=6px width="100%" src="https://assets.scsstocss.org/images/separators/aqua-gradient.png?v=7e4a141">
|
|
44
46
|
|
|
@@ -91,7 +93,7 @@ $ scss-to-css [input_path] [output_path]
|
|
|
91
93
|
```
|
|
92
94
|
|
|
93
95
|
- `[input_path]`: Path to SCSS file or directory containing SCSS files to be compiled, relative to the current working directory.
|
|
94
|
-
- `[output_path]`: Path to file or directory where CSS + source map files will be stored, relative to
|
|
96
|
+
- `[output_path]`: Path to file or directory where CSS + source map files will be stored, relative to input root (if not provided, `css/` is used).
|
|
95
97
|
|
|
96
98
|
**📝 Note:** If folders are passed, files will be processed recursively unless `-R` or `--no-recursion` is passed.
|
|
97
99
|
|
|
@@ -117,13 +119,13 @@ Compile all SCSS files in the **current directory** (outputs to `css/`):
|
|
|
117
119
|
$ scss-to-css
|
|
118
120
|
```
|
|
119
121
|
|
|
120
|
-
Compile all SCSS files in a **specific directory** (outputs to `path/to/your/directory
|
|
122
|
+
Compile all SCSS files in a **specific directory** (outputs to `css/path/to/your/directory/`):
|
|
121
123
|
|
|
122
124
|
```
|
|
123
125
|
$ scss-to-css path/to/your/directory
|
|
124
126
|
```
|
|
125
127
|
|
|
126
|
-
Compile a **specific file** (outputs to `path/to/your/
|
|
128
|
+
Compile a **specific file** (outputs to `css/path/to/your/file.min.css`):
|
|
127
129
|
|
|
128
130
|
```
|
|
129
131
|
$ scss-to-css path/to/your/file.scss
|
|
@@ -149,13 +151,14 @@ Boolean options:
|
|
|
149
151
|
-S, --no-source-maps Prevent source maps from being generated.
|
|
150
152
|
-M, --no-minify Disable minification of output CSS.
|
|
151
153
|
-R, --no-recursion Disable recursive file searching.
|
|
154
|
+
-r, --relative-output Output files relative to each source file instead of to input root.
|
|
152
155
|
-c, --copy Copy compiled CSS to clipboard instead of
|
|
153
156
|
writing to file if single source file is
|
|
154
157
|
processed.
|
|
155
158
|
-q, --quiet Suppress all logging except errors.
|
|
156
159
|
|
|
157
160
|
Parameter options:
|
|
158
|
-
--
|
|
161
|
+
--ignores="dir/,file1.scss,file2.scss" Files/directories to exclude from
|
|
159
162
|
compilation.
|
|
160
163
|
--comment="comment" Prepend header comment to
|
|
161
164
|
compiled CSS. Separate by
|
|
@@ -182,7 +185,7 @@ import scssToCSS from '@adamlui/scss-to-css';
|
|
|
182
185
|
#### CJS:
|
|
183
186
|
|
|
184
187
|
```js
|
|
185
|
-
const scssToCSS = require('@adamlui/scss-to-css')
|
|
188
|
+
const scssToCSS = require('@adamlui/scss-to-css')
|
|
186
189
|
```
|
|
187
190
|
|
|
188
191
|
###### _*Node.js version 14 or higher required_
|
|
@@ -197,10 +200,10 @@ If **source code** is passed, it is directly compiled, then an object containing
|
|
|
197
200
|
|
|
198
201
|
```js
|
|
199
202
|
const srcCode = 'h1 { font-size: 40px ; code { font-face: Roboto Mono }}',
|
|
200
|
-
compileResult = scssToCSS.compile(srcCode)
|
|
203
|
+
compileResult = scssToCSS.compile(srcCode)
|
|
201
204
|
|
|
202
|
-
console.log(compileResult.error)
|
|
203
|
-
console.log(compileResult.code)
|
|
205
|
+
console.log(compileResult.error) // outputs runtime error, or `undefined` if no error
|
|
206
|
+
console.log(compileResult.code) // outputs minified CSS: 'h1{font-size:40px}h1 code{font-face:Roboto Mono}'
|
|
204
207
|
```
|
|
205
208
|
|
|
206
209
|
If a **file path** is passed, the file's code is loaded then compiled to CSS, returning an object like above.
|
|
@@ -209,31 +212,32 @@ If a **directory path** is passed, SCSS files are searched for (recursively by d
|
|
|
209
212
|
|
|
210
213
|
```js
|
|
211
214
|
// Outputs paths to SCSS files in working directory + all nested directories
|
|
212
|
-
const compileResults = scssToCSS.compile('.')
|
|
213
|
-
compileResults.forEach(result => console.log(result.srcPath))
|
|
215
|
+
const compileResults = scssToCSS.compile('.')
|
|
216
|
+
compileResults.forEach(result => console.log(result.srcPath))
|
|
214
217
|
|
|
215
218
|
// Outputs compiled CSS from 2nd SCSS file if found, or `undefined` if not found
|
|
216
|
-
console.log(compileResults[1].code)
|
|
219
|
+
console.log(compileResults[1].code)
|
|
217
220
|
```
|
|
218
221
|
|
|
219
222
|
Options are boolean, passed as object properties. For example:
|
|
220
223
|
|
|
221
224
|
```js
|
|
222
225
|
// Returns array of data objects where `.code` contains unminified CSS
|
|
223
|
-
scssToCSS.compile(inputDir, { minify: false })
|
|
226
|
+
scssToCSS.compile(inputDir, { minify: false })
|
|
224
227
|
```
|
|
225
228
|
|
|
226
229
|
Available parameters (and their default settings) are:
|
|
227
230
|
|
|
228
|
-
Name
|
|
229
|
-
|
|
230
|
-
`recursive`
|
|
231
|
-
`verbose`
|
|
232
|
-
`dotFolders`
|
|
233
|
-
`minify`
|
|
234
|
-
`sourceMaps`
|
|
235
|
-
`
|
|
236
|
-
`
|
|
231
|
+
Name | Type | Desciption | Default value
|
|
232
|
+
-----------------|---------|-------------------------------------------------------------------------|---------------
|
|
233
|
+
`recursive` | Boolean | Recursively search for nested files if dir path passed. | `true`
|
|
234
|
+
`verbose` | Boolean | Show logging in console/terminal. | `true`
|
|
235
|
+
`dotFolders` | Boolean | Include dotfolders in file search. | `false`
|
|
236
|
+
`minify` | Boolean | Minify output CSS. | `true`
|
|
237
|
+
`sourceMaps` | Boolean | Generate CSS source maps. | `true`
|
|
238
|
+
`relativeOutput` | Boolean | Output files relative to each source file instead of to input root. | `false`
|
|
239
|
+
`ignores` | Array | Files/dirs to exclude from compilation. | `[]`
|
|
240
|
+
`comment` | String | Header comment to prepend to compiled CSS. Separate by line using '\n'. | `''`
|
|
237
241
|
|
|
238
242
|
#
|
|
239
243
|
|
|
@@ -245,8 +249,8 @@ Options are boolean, passed as object properties. For example:
|
|
|
245
249
|
|
|
246
250
|
```js
|
|
247
251
|
// Search for SCSS files in exactly assets/scss
|
|
248
|
-
const searchResults = scssToCSS.findSCSS('assets/scss', { recursive: false })
|
|
249
|
-
console.log(searchResults)
|
|
252
|
+
const searchResults = scssToCSS.findSCSS('assets/scss', { recursive: false })
|
|
253
|
+
console.log(searchResults)
|
|
250
254
|
|
|
251
255
|
/* sample output:
|
|
252
256
|
|
|
@@ -267,7 +271,7 @@ Name | Type | Desciption
|
|
|
267
271
|
`recursive` | Boolean | Recursively search for nested files in searchDir passed. | `true`
|
|
268
272
|
`verbose` | Boolean | Show logging in console/terminal. | `true`
|
|
269
273
|
`dotFolders` | Boolean | Include dotfolders in file search. | `false`
|
|
270
|
-
`
|
|
274
|
+
`ignores` | Array | Files/dirs to exclude from search results. | `[]`
|
|
271
275
|
|
|
272
276
|
<br>
|
|
273
277
|
|
|
@@ -289,12 +293,6 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
|
|
|
289
293
|
|
|
290
294
|
## 🛠️ Related utilities
|
|
291
295
|
|
|
292
|
-
### [🖼️ img-to-webp](https://github.com/adamlui/js-utils/tree/main/img-to-webp)
|
|
293
|
-
|
|
294
|
-
> Recursively compress all images to WEBPs.
|
|
295
|
-
<br>[Download](https://cdn.jsdelivr.net/gh/adamlui/js-utils/img-to-webp/img-to-webp.js) /
|
|
296
|
-
[Discuss](https://github.com/adamlui/js-utils/discussions)
|
|
297
|
-
|
|
298
296
|
### [</> minify.js](https://minify-js.org) <a href="https://github.com/toolleeo/cli-apps#programming"><img height=18 src="https://assets.scsstocss.org/images/badges/awesome/badge.svg?v=7e4a141"></a>
|
|
299
297
|
|
|
300
298
|
> Recursively minify all JavaScript files.
|
|
@@ -310,4 +308,4 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
|
|
|
310
308
|
|
|
311
309
|
<picture><source media="(prefers-color-scheme: dark)" srcset="https://assets.scsstocss.org/images/icons/home/white/icon32x27.png?v=7e4a141"><img height=13 src="https://assets.scsstocss.org/images/icons/home/dark-gray/icon32x27.png?v=7e4a141"></picture> <a href="https://js-utils.org">**More JavaScript utilities**</a> /
|
|
312
310
|
<a href="https://github.com/adamlui/scss-to-css/discussions">Discuss</a> /
|
|
313
|
-
<a href="
|
|
311
|
+
<a href="#top">Back to top ↑</a>
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@adamlui/scss-to-css",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"description": "Recursively compile all SCSS files into minified CSS",
|
|
5
5
|
"author": {
|
|
6
6
|
"name": "Adam Lui",
|
|
7
7
|
"email": "adam@kudoai.com",
|
|
8
8
|
"url": "https://github.com/adamlui"
|
|
9
9
|
},
|
|
10
|
-
"homepage": "https://
|
|
10
|
+
"homepage": "https://github.com/adamlui/scss-to-css",
|
|
11
11
|
"license": "MIT",
|
|
12
12
|
"funding": [
|
|
13
13
|
{
|
|
@@ -61,13 +61,13 @@
|
|
|
61
61
|
"stylesheets"
|
|
62
62
|
],
|
|
63
63
|
"bugs": {
|
|
64
|
-
"url": "https://
|
|
64
|
+
"url": "https://github.com/adamlui/scss-to-css/issues"
|
|
65
65
|
},
|
|
66
66
|
"dependencies": {
|
|
67
67
|
"node-clipboardy": "^1.0.3",
|
|
68
|
-
"sass": "^1.97.
|
|
68
|
+
"sass": "^1.97.2"
|
|
69
69
|
},
|
|
70
70
|
"devDependencies": {
|
|
71
|
-
"@adamlui/minify.js": "^1.
|
|
71
|
+
"@adamlui/minify.js": "^2.1.0"
|
|
72
72
|
}
|
|
73
73
|
}
|