staven630 / vue-cli4-config

vue-cli4配置vue.config.js持续更新

Home Page:https://staven630.github.io/vue-cli4-config/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

cdn vue3 提示 Vue is not undefined

carcar96 opened this issue · comments

// cdn预加载使用
const externals = {
'vue': 'Vue', // 与这个'Vue'的写法有关吗?Vue3不暴露Vue了,而是createApp
}

打包时,注释掉:// import { createApp } from 'vue';
const app = createApp(); 改成 const app = Vue.createApp(App); 即可

commented

打包时,注释掉:// import { createApp } from 'vue';
const = app = createApp(); 改成 const app = Vue.createApp(App); 即可

可以写一下你的代码么

打包时,注释掉:// import { createApp } from 'vue';
const = app = createApp(); 改成 const app = Vue.createApp(App); 即可

可以写一下你的代码么

[main.js]

import { createApp } from 'vue';
import App from './App.vue';

const app = createApp(App);
// const app = Vue.createApp(App);

app.mount('#app');

[vue.config.js]

const isProd = process.env.NODE_ENV === 'production';
module.exports = {
    chainWebpack: config => {
        config.plugin('html').tap(args => {
            if (isProd) {
                args[0].cdn = {
                    css: [],
                    js: [
                        'https://unpkg.com/vue@3.0.11/dist/vue.global.prod.js',//3.0.0版本有问题
                    ]
                }
            }
            return args;
        });
    },
    configureWebpack: config => {
        const plugins = [];

        if (isProd) {
            // externals里的模块不打包
            const externals = {
                'vue': 'Vue',
            }
            config.externals = externals;
        }

        return { plugins }
    }
}