How to use Vue.js with Requirejs?

Question

I have generated sample Vue.js project using vue-cli and built it by

vue build --target lib --name myWidget src/main.js

I must use Requirejs to load it:

    <script>
        requirejs.config({
            paths: {
                "Vue": "https://cdn.jsdelivr.net/npm/[email protected]/dist/vue",
                "myWidget": "https://codematic.tech/yamaWidget.umd",
            }
        });
    </script>

    <script>
        require(["Vue"], function (Vue) {
            console.log('Vue loaded');
            require(["myWidget"], function (widget) {
                console.log('Widget loaded');
            });
        });
    </script>

Looks like it should work, however I've got an error:

TypeError: Cannot read property 'config' of undefined

which points to

Vue.config.productionTip = false

in source code. I managed to fix it by adding Vue = window.Vue; in Vue's main.js file and window.Vue = Vue in <script> tag, after require'ing Vue. Library is loading, mounting in #app. Looks weird, but is working.

Problem is when I import something in Vue's main.js file. In example, import Snotify from 'vue-snotify'; gives me an error below:

Cannot read property 'extend' of undefined

which leads me to line:

var script = external_commonjs_vue_commonjs2_vue_root_Vue_default.a.extend({

By the way - when I load both Vue.js and myWidget.umd.js directly through <script> tag, everything is working fine!

Might need the runtime + compiler build, here's a listing of all available: cdn.jsdelivr.net/npm/vue/dist — Brian Lee
– Brian Lee, Commented Mar 2, 2019 at 10:51

feyen01 · Accepted Answer · 2019-03-04 07:50:17Z

1

Solved. Problem was external library vue-snotify which caused this issue.

answered Mar 4, 2019 at 7:50

feyen01

4177 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to use Vue.js with Requirejs?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related