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 "../".
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'
}
]
})