title: Set background image url using inline css in react js
body: <p>I have setted inline css using react method but Compiler showing "unexpected token error" where i have declare image url,  here is my file code  -     </p>
  
  <pre><code>class Aboutus extends React.Component {
      constructor(props){
          super(props);
          document.title = "About Us";
      }
  
      var imgUrl_1 = '/images/about/parallax.jpg';
      const style_1 = {
              padding: '250px 0', 
              backgroundImage: 'url('+imgUrl_1+')',
              backgroundSize: 'cover',
              backgroundPosition: 'center center',
          };
  
      var img_url2 = '/images/team/3.jpg';
      const style_2 = {
          backgroundImage: 'url('+img_url2+')', 
          backgroundPosition: 'center center no-repeat',
          backgroundSize: 'cover',    
          };
  
      const style_3 = { backgroundColor: '#F5F5F5'};  
  
      render(){
          return(
              &lt;DefaultLayout&gt;
                  &lt;section id="page-title" class="page-title-parallax page-title-dark" style={style_1} data-stellar-background-ratio="0.4"&gt;
  
                      &lt;div class="container clearfix"&gt;
                          &lt;h1&gt;About Us&lt;/h1&gt;
                          &lt;span&gt;Everything you need to know about our Company&lt;/span&gt;
                          &lt;ol class="breadcrumb"&gt;
                              &lt;li&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="#"&gt;Pages&lt;/a&gt;&lt;/li&gt;
                              &lt;li class="active"&gt;About Us&lt;/li&gt;
                          &lt;/ol&gt;
                      &lt;/div&gt;
  
                  &lt;/section&gt;
  
  
                  &lt;section id="content"&gt;
                      &lt;div class="content-wrap"&gt;
                          &lt;div class="row common-height clearfix"&gt;
                              &lt;div class="col-sm-5 col-padding" style={style_2} &gt;&lt;/div&gt;
                              &lt;div class="col-sm-7 col-padding"&gt;
                                  &lt;div&gt;
                                      &lt;div class="heading-block"&gt;
                                          &lt;span class="before-heading color"&gt;CEO &amp;amp; Co-Founder&lt;/span&gt;
                                          &lt;h3&gt;John Doe&lt;/h3&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
  
                          &lt;/div&gt;
  
                          &lt;div class="row common-height bottommargin-lg clearfix"&gt;
                              &lt;div class="col-sm-7 col-padding" style={style_3} &gt;
                                  &lt;div&gt;
                                      &lt;div class="heading-block"&gt;
                                          &lt;span class="before-heading color"&gt;Developer &amp;amp; Evangelist&lt;/span&gt;
                                          &lt;h3&gt;Mary Jane&lt;/h3&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
  
  
                          &lt;/div&gt;
                      &lt;/div&gt;
  
                  &lt;/section&gt;
              &lt;/DefaultLayout&gt;
          );  
      }
  }
  
  export default Aboutus;
  </code></pre>
  
  <p>It giving error here  - </p>
  
  <pre><code>Unexpected token (11:5)    9 |  }
    10 |  
  &gt; 11 |  var imgUrl_1 = '/images/about/parallax.jpg';
  </code></pre>
  
  <p>please let me know what I am doing wrong here . </p>