title: Tryning to secure a front End react page with keycloak server but i have this error 'keycloak.init(...).then is not a function'
body: <p>I'm trying to secure a react component with keycloak and so far i've done evrything as it told:</p>
  
  <ul>
  <li>I've installed the packages KEycloak via NPM</li>
  <li>I've put the keycloak.json in public folder</li>
  <li>I've modified my component so it would mount when page is routed</li>
  </ul>
  
  <p>but at the end i get this error:</p>
  
  <blockquote>
    <p>keycloak.init(...).then is not a function</p>
  </blockquote>
  
  <p>Ive tried to replace login-required by check-sso </p>
  
  <p>here is my code injected in my component:</p>
  
  <pre><code>import Keycloak from 'keycloak-js';
  
  componentDidMount() {
          const keycloak = Keycloak('./public/keycloak.json');
          keycloak.init({onLoad: 'login-required'}).then(authenticated =&gt; {
            this.setState({ keycloak: keycloak, authenticated: authenticated })
          })
      }
  
  render(){
      if (this.state.keycloak) {
          if (this.state.authenticated)
              return (&lt;div className="container text-dark"&gt;);
          else return (&lt;div&gt;Unable to authenticate!&lt;/div&gt;)
      }
      return (&lt;div&gt;Initializing Keycloak...&lt;/div&gt;);
  }
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/t0uVh.png" alt="Error Snapshot"></p>