Unable to run Vega-Lite visualization example through local server

Question

I am learning Vega-Lite.

When I try to run a simple bar chart example. Browser console throws an error:

I am running this example

I am using webstorm IDE; It creates a local server through which I am serving webpage to browser. I have also tested with python http server as well. Results are same.

Error:

Failed to load resource: the server responded with a status of 404 ()
vega-embed@4:1 The input spec uses Vega-Lite v4, but the current version of Vega-Lite is vnot available.  
(anonymous) @ vega-embed@4:1
vega-embed@4:1 Uncaught (in promise) TypeError: Cannot read property 'compile' of undefined
    at Object.vega-lite (vega-embed@4:1)
    at vega-embed@4:1
    at Generator.next (<anonymous>)
    at vega-embed@4:1
    at new Promise (<anonymous>)
    at ce (vega-embed@4:1)
    at Ke (vega-embed@4:1)
    at et (vega-embed@4:1)
    at barexample.html?_ijt=lq5v9im4hg0eforrhc1pcvqivf:55

Answer 1

Solution:

updating script source fixed the issue:

<script src="https://cdn.jsdelivr.net/npm/vega@5"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-lite@3"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-embed@4"></script>

Answer 2

upgrade dependencies, not vega-embed@4 for vega-lite@4.0.0-beta.2

<script src="https://cdn.jsdelivr.net/npm/vega@5.6.0"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-lite@4.0.0-beta.2"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-embed@5.1.2"></script>

or

<script src="https://cdn.jsdelivr.net/npm/vega@5"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-lite@4.0.0-beta.2"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-embed@5"></script>