I want to code a desktop application using Electron, nuxt.js and am4charts. When importing the am4charts core with
import * as am4core from '@amcharts/amcharts4/core'
the app returns an error:
export { System, system } from "./.internal/core/System"; ^^^^^^ SyntaxError: Unexpected token export
My setup:
- Electron-nuxt boilerplate (https://github.com/michalzaq12/electron-nuxt)
- “@amcharts/amcharts4”: “^4.7.1”
I already tried to transpile amCharts in nuxt.config.js using
build: { transpile: [ '@amcharts/amcharts4' ], vendor: ['v-tooltip'] }
but without success. How can I fix this issue?
Advertisement
Answer
I found it could be known issue between nuxt.js and amcharts.js and it has a solution as follows:
create a file plugins/amcharts.js
import * as am4core from "@amcharts/amcharts4/core"; import * as am4charts from "@amcharts/amcharts4/charts"; import am4themes_animated from "@amcharts/amcharts4/themes/animated"; import am4themes_dark from "@amcharts/amcharts4/themes/dark"; import Vue from "vue"; Vue.prototype.$am4core = () => { return { am4core, am4charts, am4themes_animated, am4themes_dark } }
then add to nuxt.config.js
plugins: [ { src: '~/plugins/amCharts.js', ssr: false } ],
in components file
mounted() { let {am4core, am4charts, am4themes_animated, am4themes_dark} = this.$am4core(); }
Solution is found on Github: https://github.com/nuxt/nuxt.js/issues/3336