MIME type as text/plain for Sass stylesheet in chrome

Question

I've got a normal website of files on my local machine and would like to use Sass. In the <head> of my index page I have:

<link rel="stylesheet" type="text/css" href="stylesheets/style.scss" />

Though when I run this in Chrome I get an error in the console:

Resource interpreted as Stylesheet but transferred with MIME type text/plain coming from the link tag in index.

How can I change the meme type so Chrome renders my Sass styles?

What gave you the impression that Sass files could be used this way? — cimmanon, Oct 29 '13 at 13:19
I don't think that Chrome can currently evaluate raw .scss files as .css. You probably still need to compile to CSS. — KatieK, Oct 29 '13 at 18:23

Steven Vachon · Answer 1 · 2016-11-30T16:33:25.857

10

text/x-sass and text/x-scss, according to https://github.com/janlelis/rubybuntu-mime/blob/master/sass.xml

Know that this will not make a web browser compile it to CSS for you as they do not contain a SASS parser/compiler. The only use case for this would be a template that is intended to be transformed via a configured HTML parser.

edited Nov 30 '16 at 16:33

answered Nov 30 '16 at 16:27

Steven Vachon

3,814
1
30
30

What is the purpose of the `x` prefix? I know this is sometimes used for non-standard HTTP headers, is there such a thing as a non-standard mimetype? – exciteabletom May 06 '21 at 03:49

score 4 · Accepted Answer · answered Oct 29 '13 at 13:13

4

Don't think you can insert SASS right into your web page. There must be some SASS preprocessor first. That gives you a normal CSS file.

answered Oct 29 '13 at 13:13

iiic

1,366
2
15
23

1

You could theoretically have an HTML document with a ` – Steven Vachon Nov 30 '16 at 16:25

score 4 · Answer 3 · edited May 23 '17 at 12:30

4

Are you sure you want to use plain Scss as a stylesheet, without any compilation, in your page?
Tell your http server to use "text/css" as the content-type for your *.scss files (see related Chrome says "Resource interpreted as script but transferred with MIME type text/plain.", what gives?)

edited May 23 '17 at 12:30

Community

1
1

answered Oct 29 '13 at 13:13

Alexander Pavlov

31,598
5
67
93

score 0 · Answer 4 · answered Jan 07 '20 at 00:56

In your particular case the issue is that you are linking a scss file in your html and chrome can not interpret scss.

What you needs to do is use the pre processor in sass to turn the files from sass to css. You can do the following open your terminal and open the directory where your scss is stored and run the sass --watch main.scss main.css this will process your scss to the css you need and keep checking for changes. In this case my sass file is name main.scss and it will turn my sass to css in the main.css file.

After this is done what you need to do is link the css file in your html and it should work make sure you point to the correct file.

MIME type as text/plain for Sass stylesheet in chrome

4 Answers4