SASS - How to synchronise style.scss with style.css file?
up vote
0
down vote
favorite
I'm using SASS, writing in style.scss compiling to (style.css & style.map.css), but how to convert style.css file to completely normal style.css file?
The compiled style.css file looks like this
div{
margin: 0 auto;}
p {
text-align: center;}
How to convert it into normal.css?
sass compilation
asked Nov 7 at 12:18
Nakov
386
add a comment |
up vote
0
down vote
favorite
I'm using SASS, writing in style.scss compiling to (style.css & style.map.css), but how to convert style.css file to completely normal style.css file?
The compiled style.css file looks like this
div{
margin: 0 auto;}
p {
text-align: center;}
How to convert it into normal.css?
sass compilation
asked Nov 7 at 12:18
Nakov
386
We need more information. If you're successfully compiling your SCSS into CSS, style.css should already be a "normal" CSS file. Can you explain more about what you're trying to achieve, and why?
– wiiiiilllllll
Nov 7 at 16:45
This is already a normal CSS file.
– Quentin Veron
Nov 7 at 17:48
Yes, but how to make parentheses on a new line, and the tags also on a new line?
– Nakov
Nov 8 at 6:20
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
I'm using SASS, writing in style.scss compiling to (style.css & style.map.css), but how to convert style.css file to completely normal style.css file?
The compiled style.css file looks like this
div{
margin: 0 auto;}
p {
text-align: center;}
How to convert it into normal.css?
sass compilation
asked Nov 7 at 12:18
Nakov
386
I'm using SASS, writing in style.scss compiling to (style.css & style.map.css), but how to convert style.css file to completely normal style.css file?
The compiled style.css file looks like this
div{
margin: 0 auto;}
p {
text-align: center;}
How to convert it into normal.css?
div{
margin: 0 auto;}
p {
text-align: center;}
div{
margin: 0 auto;}
p {
text-align: center;}
sass compilation
sass compilation
asked Nov 7 at 12:18
Nakov
386
asked Nov 7 at 12:18
Nakov
386
edited Nov 7 at 17:03
asked Nov 7 at 12:18
Nakov
386
asked Nov 7 at 12:18
Nakov
386
asked Nov 7 at 12:18
Nakov
386
386
We need more information. If you're successfully compiling your SCSS into CSS, style.css should already be a "normal" CSS file. Can you explain more about what you're trying to achieve, and why?
– wiiiiilllllll
Nov 7 at 16:45
This is already a normal CSS file.
– Quentin Veron
Nov 7 at 17:48
Yes, but how to make parentheses on a new line, and the tags also on a new line?
– Nakov
Nov 8 at 6:20
add a comment |
We need more information. If you're successfully compiling your SCSS into CSS, style.css should already be a "normal" CSS file. Can you explain more about what you're trying to achieve, and why?
– wiiiiilllllll
Nov 7 at 16:45
This is already a normal CSS file.
– Quentin Veron
Nov 7 at 17:48
Yes, but how to make parentheses on a new line, and the tags also on a new line?
– Nakov
Nov 8 at 6:20
We need more information. If you're successfully compiling your SCSS into CSS, style.css should already be a "normal" CSS file. Can you explain more about what you're trying to achieve, and why?
– wiiiiilllllll
Nov 7 at 16:45
We need more information. If you're successfully compiling your SCSS into CSS, style.css should already be a "normal" CSS file. Can you explain more about what you're trying to achieve, and why?
– wiiiiilllllll
Nov 7 at 16:45
This is already a normal CSS file.
– Quentin Veron
Nov 7 at 17:48
This is already a normal CSS file.
– Quentin Veron
Nov 7 at 17:48
Yes, but how to make parentheses on a new line, and the tags also on a new line?
– Nakov
Nov 8 at 6:20
Yes, but how to make parentheses on a new line, and the tags also on a new line?
– Nakov
Nov 8 at 6:20
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
accepted
The default output style for Sass is normally nested, which is the style/formatting you see in your style.css file.
Possible options are:
nestedexpandedcompressedcompact
If you change the output to expanded before compiling your file, you will probably get the style you want.
sass --watch scss:css --style expanded
Will produce this:
div {
margin: 0 auto;
}
p {
text-align: center;
}
PS. If you are using somtehing like Gulp, the task could be set up like this:
.pipe(sass({ outputStyle: 'expanded' }))
answered Nov 8 at 12:27
Trollsyn
430310
That's exactly what I was searching for, many Thanks. Just one more question - the command creates style.css file and style.css.map file - how the program knows where to put them and how to name them?
– Nakov
Nov 9 at 10:33
If you are using the command line, the.mapfile will always be in the same folder and with the same name, as far as I know.
– Trollsyn
Nov 9 at 14:32
PS. If my answer solved your problem, please accept it by clicking the grey checkmark on the left side of my answer :)
– Trollsyn
Nov 12 at 8:49
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
accepted
The default output style for Sass is normally nested, which is the style/formatting you see in your style.css file.
Possible options are:
nestedexpandedcompressedcompact
If you change the output to expanded before compiling your file, you will probably get the style you want.
sass --watch scss:css --style expanded
Will produce this:
div {
margin: 0 auto;
}
p {
text-align: center;
}
PS. If you are using somtehing like Gulp, the task could be set up like this:
.pipe(sass({ outputStyle: 'expanded' }))
answered Nov 8 at 12:27
Trollsyn
430310
That's exactly what I was searching for, many Thanks. Just one more question - the command creates style.css file and style.css.map file - how the program knows where to put them and how to name them?
– Nakov
Nov 9 at 10:33
If you are using the command line, the.mapfile will always be in the same folder and with the same name, as far as I know.
– Trollsyn
Nov 9 at 14:32
PS. If my answer solved your problem, please accept it by clicking the grey checkmark on the left side of my answer :)
– Trollsyn
Nov 12 at 8:49
add a comment |
up vote
0
down vote
accepted
The default output style for Sass is normally nested, which is the style/formatting you see in your style.css file.
Possible options are:
nestedexpandedcompressedcompact
If you change the output to expanded before compiling your file, you will probably get the style you want.
sass --watch scss:css --style expanded
Will produce this:
div {
margin: 0 auto;
}
p {
text-align: center;
}
PS. If you are using somtehing like Gulp, the task could be set up like this:
.pipe(sass({ outputStyle: 'expanded' }))
answered Nov 8 at 12:27
Trollsyn
430310
That's exactly what I was searching for, many Thanks. Just one more question - the command creates style.css file and style.css.map file - how the program knows where to put them and how to name them?
– Nakov
Nov 9 at 10:33
If you are using the command line, the.mapfile will always be in the same folder and with the same name, as far as I know.
– Trollsyn
Nov 9 at 14:32
PS. If my answer solved your problem, please accept it by clicking the grey checkmark on the left side of my answer :)
– Trollsyn
Nov 12 at 8:49
add a comment |
up vote
0
down vote
accepted
up vote
0
down vote
accepted
The default output style for Sass is normally nested, which is the style/formatting you see in your style.css file.
Possible options are:
nestedexpandedcompressedcompact
If you change the output to expanded before compiling your file, you will probably get the style you want.
sass --watch scss:css --style expanded
Will produce this:
div {
margin: 0 auto;
}
p {
text-align: center;
}
PS. If you are using somtehing like Gulp, the task could be set up like this:
.pipe(sass({ outputStyle: 'expanded' }))
answered Nov 8 at 12:27
Trollsyn
430310
The default output style for Sass is normally nested, which is the style/formatting you see in your style.css file.
Possible options are:
nestedexpandedcompressedcompact
If you change the output to expanded before compiling your file, you will probably get the style you want.
sass --watch scss:css --style expanded
Will produce this:
div {
margin: 0 auto;
}
p {
text-align: center;
}
PS. If you are using somtehing like Gulp, the task could be set up like this:
.pipe(sass({ outputStyle: 'expanded' }))
answered Nov 8 at 12:27
Trollsyn
430310
answered Nov 8 at 12:27
Trollsyn
430310
answered Nov 8 at 12:27
Trollsyn
430310
answered Nov 8 at 12:27
Trollsyn
430310
430310
That's exactly what I was searching for, many Thanks. Just one more question - the command creates style.css file and style.css.map file - how the program knows where to put them and how to name them?
– Nakov
Nov 9 at 10:33
If you are using the command line, the.mapfile will always be in the same folder and with the same name, as far as I know.
– Trollsyn
Nov 9 at 14:32
PS. If my answer solved your problem, please accept it by clicking the grey checkmark on the left side of my answer :)
– Trollsyn
Nov 12 at 8:49
add a comment |
That's exactly what I was searching for, many Thanks. Just one more question - the command creates style.css file and style.css.map file - how the program knows where to put them and how to name them?
– Nakov
Nov 9 at 10:33
If you are using the command line, the.mapfile will always be in the same folder and with the same name, as far as I know.
– Trollsyn
Nov 9 at 14:32
PS. If my answer solved your problem, please accept it by clicking the grey checkmark on the left side of my answer :)
– Trollsyn
Nov 12 at 8:49
That's exactly what I was searching for, many Thanks. Just one more question - the command creates style.css file and style.css.map file - how the program knows where to put them and how to name them?
– Nakov
Nov 9 at 10:33
That's exactly what I was searching for, many Thanks. Just one more question - the command creates style.css file and style.css.map file - how the program knows where to put them and how to name them?
– Nakov
Nov 9 at 10:33
If you are using the command line, the
.map file will always be in the same folder and with the same name, as far as I know.– Trollsyn
Nov 9 at 14:32
If you are using the command line, the
.map file will always be in the same folder and with the same name, as far as I know.– Trollsyn
Nov 9 at 14:32
PS. If my answer solved your problem, please accept it by clicking the grey checkmark on the left side of my answer :)
– Trollsyn
Nov 12 at 8:49
PS. If my answer solved your problem, please accept it by clicking the grey checkmark on the left side of my answer :)
– Trollsyn
Nov 12 at 8:49
add a comment |
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53189332%2fsass-how-to-synchronise-style-scss-with-style-css-file%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
We need more information. If you're successfully compiling your SCSS into CSS, style.css should already be a "normal" CSS file. Can you explain more about what you're trying to achieve, and why?
– wiiiiilllllll
Nov 7 at 16:45
This is already a normal CSS file.
– Quentin Veron
Nov 7 at 17:48
Yes, but how to make parentheses on a new line, and the tags also on a new line?
– Nakov
Nov 8 at 6:20