title: How to implement ag-grid into nuxt.js
body: <p>How to integrate <code>ag-grid</code> to work with <code>nuxt.js</code> via the <code>nuxt.config</code> file?</p>
  
  <p>The error I'm getting:</p>
  
  <blockquote>
    <p>commons.app.js:16278 Uncaught TypeError: Cannot read property '_init' of null<br>
    at AgGridVue (commons.app.js:16278)<br>
    at Function.Vue.use (commons.app.js:16233)<br>
    at Module../plugins/ag-grid.client.js (app.js:5186)<br>
    at <strong>webpack_require</strong> (runtime.js:791)<br>
    at fn (runtime.js:151)<br>
    at Module../.nuxt/index.js (app.js:1997)<br>
    at <strong>webpack_require</strong> (runtime.js:791)<br>
    at fn (runtime.js:151)<br>
    at Module. (app.js:236)<br>
    at Module../.nuxt/client.js (app.js:1308)</p>
  </blockquote>
  
  <p><code>ag-grid.client.js</code>:</p>
  
  <pre><code>import Vue from "vue";
  import { AgGridVue } from "ag-grid-vue";
  
  Vue.use(AgGridVue);
  </code></pre>
  
  <p><code>nuxt.config.js</code>:</p>
  
  <pre><code> plugins: [
  "@/plugins/element-ui",
  "@/plugins/tooltip",
  "@/plugins/calendar",
  "@/plugins/ag-grid.client.js"
  ],
  </code></pre>
  
  <p>The file to load table into:</p>
  
  <pre><code>&lt;template&gt;
    &lt;div class="flex h-full"&gt;
        &lt;no-ssr&gt;
  
      &lt;ag-grid-vue style="width: 500px; height: 500px;"
                   class="ag-theme-balham"
                   :columnDefs="columnDefs"
                   :rowData="rowData"&gt;
      &lt;/ag-grid-vue&gt;
  &lt;/no-ssr&gt;
  
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    components: {},
    data() {
      return {
        columnDefs: null,
        rowData: null
      };
    },
    beforeMount() {
      this.columnDefs = [
        { headerName: "Make", field: "make" },
        { headerName: "Model", field: "model" },
        { headerName: "Price", field: "price" }
      ];
  
      this.rowData = [
        { make: "Toyota", model: "Celica", price: 35000 },
        { make: "Ford", model: "Mondeo", price: 32000 },
        { make: "Porsche", model: "Boxter", price: 72000 }
      ];
    }
  };
  &lt;/script&gt;
  </code></pre>