Readonly issues when using vue externally (CDN)

Describe the bug

I am receiving multiple readonly errors form bootstrap-vue modules when loading Vue from a CDN, the errors in question were discussed extensively in #3040.

Steps to reproduce the bug

1. Load in vue via https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.runtime.js
2. Import some bootstrap-vue components: import { BCard, BCollapse, VBToggle } from 'bootstrap-vue';
3. Build a component (UMD format).
4. Open browser
5. Components work as expected (more or less) but console is full of errors.

Expected behavior

No console errors.

Versions

Libraries:

• BootstrapVue: 2.1.0
• Bootstrap: 4.4.1
• Vue: 2.6.10

Environment:

• Device: Desktop
• OS: Ubuntu 18.10
• Browser: Chrome
• Version: 79.0.3945.88

Demo link

It is difficult to put together because I have a fairly custom build process, I am hoping it is obvious based on the description, if not I can try to put a demo together by just copy/pasting a built component.

Additional context

This has only become an issue in recent versions of bootstrap-vue I think it may be to do with portal-vue.

[chopfitzroy]

Got it!

Needed to be:

{
        input: 'src/components/ExampleComponent.vue',
        external: ['vue'],
        output: {
                name: 'example_component',
                file: 'dist/example_component.umd.min.js',
                format: 'umd',
                globals: {
                        vue: 'Vue'
                }
        }
}

[chopfitzroy]

Hey @tmorehouse,

Bizzare, I will keep looking into this and post if I find a solution.

Cheers!