CODEWITHSUNDEEP
reactjsjsx
Aykut Korkmaz
Aykut Korkmaz

Reputation: 11

What is Parsing error: Invalid escape sequence in template?

<style jsx>{`
      #x {                      
        text-align: center;     
        font-weight: 900;       
        font-size: xx-large;    
        margin-bottom: 30px;    
        color: #f4511e;         
      }
`}</style>

And when I was typed "npm start" to terminal, terminal shows this warning; Screenshot

Upvotes: 1

Views: 3431

Answers (1)

Khabir
Khabir

Reputation: 5842

I did some research on google and nowhere I found that id selector is used in styled jsx but everywhere I see that class selector is used. You can follow this example:

function Home() {
  return (
    <div className="container">
      <h1>Hello Next.js</h1>
      <Widget />
      <style jsx>{`
        .container {
          margin: 50px;
        }
        .container :global(.btn) {
          background: #000;
          color: #fff;
        }
      `}</style>
    </div>
  )
}

export default Home

Upvotes: 2

Related Questions