Uncaught TypeError: Cannot read properties of undefined (reading ‘createElementVNode‘)

Uncaught TypeError: Cannot read properties of undefined (reading ‘createElementVNode’)

problem

Configure cdn through vite-plugin-cdn-import
Mainly includes vue element

vite configuration

import importToCDN from "vite-plugin-cdn-import"
{
    
    
    plugins: [
        importToCDN({
    
    
            modules: [
                {
    
    
                    name: 'vue',
                    var: 'vue', 
                    path: 'https://cdn.bootcdn.net/ajax/libs/vue/3.3.4/vue.cjs.js',
                },{
    
    
                    name: 'element-plus',
                    var: 'ElementPlus', 
                    path: 'https://cdn.bootcdn.net/ajax/libs/element-plus/2.3.12/index.full.min.js',
                },
            ],
        }),
    ]
}

An error occurred on the page after deployment:
element-plus index.full.min.js:28:2676
Uncaught TypeError: Cannot read properties of undefined (reading 'createElementVNode')
vue3 vue.cjs.js: 3:23
vue.cjs.js:3 Uncaught ReferenceError: exports is not defined
list:1 Uncaught TypeError: Failed to resolve module specifier "vue". Relative references must start with either "/", "./", or "../".

Insert image description here

Insert image description here

reason

Configurations depend on each other

solution

Adjust the configuration as follows:
The specific version of each package can be found in yarn.lock

// 下面这个配置可行
// 第三方库CDN引入
importToCDN({
    
    
    prodUrl: 'https://unpkg.com/{name}@{path}',
    modules: [
        {
    
    
            name: 'vue',
            var: 'Vue',
            path: '3.3.4'
        },
        {
    
    
            name: 'vue-demi', // vue版本选好 不然会报错
            var: 'VueDemi',
            path: '0.14.6'
        },
        {
    
    
            name: 'vue-router',
            var: 'VueRouter',
            path: '4.0.10'
        },
        {
    
    
            name: 'element-plus',
            var: 'ElementPlus',
            path: '2.3.12',
            css: '2.3.12/dist/index.css'
        },
        {
    
    
            name: '@element-plus/icons-vue',
            var: 'ElementPlusIconsVue', // 根据main.js中定义的来
            path: '2.1.0'
        },
        {
    
    
            name: 'pinia',
            var: 'Pinia',
            path: '2.1.6'
        }
    ]
})

Guess you like

Origin blog.csdn.net/qubes/article/details/133683373