Vite+Vue使用外部CDN引用element-plus全家桶
参考:vue3+vite2增加element-plus的CDN链接打包构建
网上 Vite.js 的资料少,踩了不少坑
在掘金中找到一篇资料,但还是避免不了遇到了一些奇奇怪怪的问题
我这边使用的 vite-plugin-cdn-import
插件
编辑 vite.config.ts
1
| import { Plugin as importToCDN } from "vite-plugin-cdn-import";
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25
| importToCDN({ modules: [ { name: "vue", var: "Vue", path: "//unpkg.com/vue@next", }, { name: "vuex", var: "Vuex", path: "//unpkg.com/vuex@next", }, { name: "vue-class-component", var: "VueClassComponent", path: "//unpkg.com/vue-class-component@next", }, { name: "element-plus", var: "ElementPlus", path: "//unpkg.com/element-plus", css: "//unpkg.com/element-plus/dist/index.css", }, ], }),
|
用原文中的方法会出现错误
原因参考:使用了pinia或其他依赖于vue的库
上面方式可解决