# How can we generate vega grammar JSON from vega-lite plot?

**URL:** <https://talk.observablehq.com/t/how-can-we-generate-vega-grammar-json-from-vega-lite-plot/6458>\
**Category:** Help\
**Created:** [April 16, 2022, 11:49am UTC](https://talk.observablehq.com/t/how-can-we-generate-vega-grammar-json-from-vega-lite-plot/6458 "2022-04-16T11:49:47Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Mahesha999](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mahesha999/32/6382_2.png) [@Mahesha999](https://talk.observablehq.com/u/Mahesha999)\
**Post date:** [April 16, 2022, 11:49am UTC](https://talk.observablehq.com/t/how-can-we-generate-vega-grammar-json-from-vega-lite-plot/6458/1 "2022-04-16T11:49:47Z")

</div>

I am able to get vega json grammar on local installation of nodejs with `vega-lite` and `vega-lite-api` installed through `npm` as follows:

```auto
vl = require('vega-lite') 
vla = require('vega-lite-api') 
data = require('vega-datasets') 

const df2 = data['movies.json']()

const plot = vla.markBar().data(df2).encode(
    vla.x().fieldQ('IMDB_Rating').bin(true),
    vla.y().count()
  )

vega_lite_json = plot.toObject();
vega_json = vl.compile(plot.toObject()).spec;

```

However I am unable to make it work in Observablehq.

I am not able to do last line: `vl.compile(...)`.  
This is what I have did:

```
vegalite = require("@observablehq/vega-lite@0.2")
vegalite.compile(plot.toObject()).spec;

```

It says: `TypeError: vegalite.compile is not a function`  
Here is [link to my observablehq notebook cell](https://observablehq.com/d/440df37a1f6c5e48#cell-65) executing `vegalie.compile(...)`.

What I am doing wrong?

---

<div class="post-metadata">

**Author:** ![mbostock](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mbostock/32/9_2.png) [@mbostock](https://talk.observablehq.com/u/mbostock)\
**Post date:** [April 16, 2022, 5:28pm UTC](https://talk.observablehq.com/t/how-can-we-generate-vega-grammar-json-from-vega-lite-plot/6458/2 "2022-04-16T17:28:21Z")

</div>

Cross-posted to Stack Overflow: [javascript - How can we proramatically generate vega grammar JSON from vega-lite plot? - Stack Overflow](https://stackoverflow.com/questions/71893649/how-can-we-proramatically-generate-vega-grammar-json-from-vega-lite-plot)

---

<div class="post-metadata">

**Author:** ![Fil](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/fil/32/207_2.png) [@Fil](https://talk.observablehq.com/u/Fil)\
**Post date:** [April 18, 2022, 8:24am UTC](https://talk.observablehq.com/t/how-can-we-generate-vega-grammar-json-from-vega-lite-plot/6458/3 "2022-04-18T08:24:23Z")

</div>

you could try and use `vegalite = vl.vegalite`; or, equivalently, call:

> vl.vegalite.compile(plot.toObject()).spec