Vue-chartjs components creating a second Vue runtime

[v-stein]

Actual Behavior

When registering a custom component using vue-chartjs, at the moment of the require, a second Vue runtime is executed, resulting:

You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at https://vuejs.org/guide/deployment.html

You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at https://vuejs.org/guide/deployment.html

In boostrap.js there is this line:

window.Vue = require('vue');

But I figured out that in each vue-chartjs component (as Bar, Line, ...) there is also this line:

import Vue from 'vue'

Environment

• NPM Version: 4.1.2
• Node Version: 7.4.0
• Laravel Version: 5.4
• Vue Version: 1.10

[apertureless]

I am utilizing Vue.extend() to create the chart components. Because the usage of the components would be this way clean, easy and extendable.

If you know a better way, feel free to submit a PR :)

[apertureless]

Well, beause this is not valid javascript. You can't add a if condition before an import. Furthermore, not everyone is exposing vue to the global window scrope. If you use webpack or other bundlers you may also use Vue with an scoped import state. import Vue from 'vue' const app = new Vue({}) export default app  etc.  And even that, the components get bundled over webpack. So there is never vue in the window scope.

…

--  Jakub J Sent with Airmail On 17. Februar 2017 at 13:52:06, Victor Steinmann (notifications@github.com) wrote: Why not testing if vue is already defined ? if (!'Vue' in window) import Vue from 'vue' — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.