CODEWITHSUNDEEP
vue.jswebpackvue-componentecharts
spark
spark

Reputation: 1381

Configure vue-echart-v3 with Vue for supporting IE

I am trying to use echarts with vuejs. I have found vue-echarts-v3 as a perfect solution for my use case. After drawing all my charts I noticed that my web-app is not rendering in IE with syntax error(SCRIPT1002: Syntax error). I figured out that this error is due to the echart library I am using.

on the npm page following configuration is given: For webpack 1.x:


      {
        test: /\.js$/,
        loader: 'babel',
        include: [
 -          path.join(prjRoot, 'src')
 -          path.join(prjRoot, 'src'),
 -          path.join(prjRoot, 'node_modules/vue-echarts-v3/src')
        ],
 -        exclude: /node_modules/
 -        exclude: /node_modules(?![\\/]vue-echarts-v3[\\/]src[\\/])/
      },

For webpack 2.x+:


      {
        test: /\.js$/,
        loader: 'babel-loader',
 -       include: [resolve('src'), resolve('test')]
 -       include: [resolve('src'), resolve('test'), resolve('node_modules/vue-echarts-v3/src')]
      }

How do I configure the same in vue-config.js? These are the package versions I am using:

Upvotes: 0

Views: 456

Answers (1)

Pratik Patel
Pratik Patel

Reputation: 6978

Try this.

The documentation of vue-echarts-v3 does not inform it, but you have to add the echarts on your webpack (or any other bundler you are using) configuration as well.

{
    test: /\.js$/,
    loader: 'babel-loader',
    include: [
      resolve('src'),
      resolve('test'),
      resolve('node_modules/vue-echarts-v3/src'), // Their suggestion https://www.npmjs.com/package/vue-echarts-v3
      resolve('node_modules/echarts/lib'), // Not suggested, but required as well
    ]
  },

Upvotes: 1

Related Questions