MarksCode MarksCode - 2 months ago 16
CSS Question

Multiline string, invalid or unexpected token

I'm trying to add css to my page dynamically by building a css string that will be appended to the document's head. Since this string is long I want to break it up into multiple lines in my editor, so I do the following:

function generateCss(colors){
var cssString = "* {margin: 0;padding: 0;} \
#mainWrapper {width: 100vw;height: 100vh;background-color:#"+ colors['background'] + ";} \
#mainWrapper div {height: 2vw;} \
.cell {width: 2vw;background-color:#"+ colors['color1'] + ";display: inline-block;} \
.active {background-color:#"+ colors['color2'] +" !important;}";
console.log(cssString);
}


However, on the line where I create the
cssString
I get error:
Uncaught SyntaxError: Invalid or unexpected token
. Can anybody please help me figure out what I'm doing wrong?

This is a picture of my IDE for syntax highlighting reference:

IDE

Answer
var cssString = "* {margin: 0;padding: 0;} \ 

Note that you have an extra space at the end of the string. This causes the problem.

P.S. as a side note, it might be good to take in use something different then escaping, as stated in the following question:

Creating multiline strings in JavaScript