Home

Issue: 131

How to use JSX from vue plugin?

[issue link]

Hello. I’m trying to use vue-tables-2 plugin, it uses JSX in your own templates.

packages.json

{
  //...
  "dependencies": {
    "babel-helper-vue-jsx-merge-props": "^2.0.2",
    "babel-plugin-syntax-jsx": "^6.18.0",
    "babel-plugin-transform-vue-jsx": "^3.3.0",
    "nuxt": "latest",
    "vue-tables-2": "^0.2.77"
  },
  //...
}

nuxt.config.js

module.exports = {
  build: {
    vendor: ['vue-tables-2'],
    babel: {
      plugins: ['transform-vue-jsx']
    }
  },
  plugins: ['~plugins/vue-tables-2'],
  //...
}

plugins/vue-tables-2.js

import Vue from 'vue'
import VueTables from 'vue-tables-2'

Vue.use(VueTables.server, {}, true)

But I get the following error:

ERROR in ./~/vue-tables-2/lib/template.jsx
Module parse failed: app_root/node_modules/vue-tables-2/lib/template.jsx Unexpected token (15:7)
You may need an appropriate loader to handle this file type.

Please tell me what am I doing wrong?

This question is available on Nuxt.js community (#c111)