Config file
0x3333 opened this issue · comments
Hi!
I have a .jsbeautifyrc
file with the following content:
{
"js": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 2
},
"css": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 1
},
"html": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 1
}
}
Target:
jsbeautifier: {
options: {
config: '.jsbeautifyrc'
},
files: [
'<%= config.srcPath %>/css/app.scss'
]
},
app.scss:
@import 'const';
/* Main */
html {
height: 100%;
}
body {
height: 100%;
margin: 0px;
padding: 0px;
background-color: $google-maps-background-color;
}
When I run the target above I get my css scrambled. Output:
@import 'const'; /* Main */ html { height: 100%; } body { height: 100%; margin: 0px; padding: 0px; background-color: $background-color; }
With -v
option I see the output:
Beautify config before converting camelcase to underscore: {"js":{"js":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":2},"css":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"html":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":2,"fileTypes":[".js",".json"]},"css":{"js":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":2},"css":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"html":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1,"fileTypes":[".css"]},"html":{"js":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":2},"css":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"html":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1,"fileTypes":[".html"]}}
Using beautify config: {"js":{"js":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":2},"css":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"html":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"fileTypes":[".js",".json"],"indent_size":2,"indent_char":" ","preserve_newlines":true,"max_preserve_newlines":2},"css":{"js":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":2},"css":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"html":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"fileTypes":[".css"],"indent_size":2,"indent_char":" ","preserve_newlines":true,"max_preserve_newlines":1},"html":{"js":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":2},"css":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"html":{"indentSize":2,"indentChar":" ","preserveNewlines":true,"maxPreserveNewlines":1},"fileTypes":[".html"],"indent_size":2,"indent_char":" ","preserve_newlines":true,"max_preserve_newlines":1}}
The properties in the final config doesn't get merged, they are multiplied(Just the output above formatted):
{
"js": {
"js": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 2
},
"css": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 1
},
"html": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 1
},
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 2,
"fileTypes": [".js", ".json"]
},
"css": {
"js": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 2
},
"css": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 1
},
"html": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 1
},
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 1,
"fileTypes": [".css"]
},
"html": {
"js": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 2
},
"css": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 1
},
"html": {
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 1
},
"indentSize": 2,
"indentChar": " ",
"preserveNewlines": true,
"maxPreserveNewlines": 1,
"fileTypes": [".html"]
}
}
I see what you are saying, but it shouldn't affect as its adding expected config as well. If you see attribute maxPreserveNewlines in js, css & html you will notice the difference.
I will update the code to remove unwanted properties after merge.
Regarding .scss file, please check if its supported by https://github.com/beautify-web/js-beautify
If .scss files are supported by js-beautify, then you will need to specify using, https://github.com/vkadam/grunt-jsbeautifier#3-beautify-files-other-than-js-json-es6-css--html
Unwanted config is removed in 480e22d, will be published in next version
Released 0.2.12