vite-plugin-cdn-import插件官网:https://github.com/mmf-fe/vite-plugin-cdn-import 一、分析依赖视图 书接上文,我们使用rollup-plugin-visualizer分析依赖视图: 分析上图,我们发现整个项目依赖为581KB,其中vue体积占比42.75%,248.75KB大小,其次是vue-router占比17.56,而vue中的runtime-core/dist/runtime-core.es...
// vite.config.jsimportcdnfrom'vite-plugin-cdn-import'exportdefault{plugins:[cdn({modules:[{name:'react',var:'React',path:`umd/react.production.min.js`,},{name:'react-dom',var:'ReactDOM',path:`umd/react-dom.production.min.js`,},],}),],} Use preset // vite.config.jsimportcdnfro...
import vue from "@vitejs/plugin-vue"; import commonjs from "rollup-plugin-commonjs"; import externalGlobals from "rollup-plugin-external-globals"; //全局对象const globals = externalGlobals({ vue: "Vue", vuex: "Vuex", vueRouter: "VueRouter", "element-plus": "element" }) const plugins ...
npm i vite-plugin-cdn-import-rely --save-dev Usage Example importimportFromCDNfrom"vite-plugin-cdn-import-rely";exportdefaultdefineConfig({plugins:[importFromCDN([{name:"element-plus",var:"ElementPlus",path:"index.full.min.js",relys:["vue"],},{name:"element-plus/es/locale/lang/zh-cn"...
// vue等使用cdn加载 rollupOptions: { external: ['vue', 'vue-router'], plugins: [ commonjs(), externalGlobals({ vue: 'Vue', 'vue-router': 'VueRouter', }), ], }, 生产环境报错,开发环境正常Uncaught TypeError: Failed to resolve module specifier "vue". Relative references must start wit...
exportdefaultrouter; 接下来在main.ts文件中集成Vue-Router: import { createApp } from 'vue'; import App from'./App.vue'; import router from"./router"; const app=createApp(App); app.use(router); app.mount('#app'); 测试一下,这里修改一下App.vue的代码,测试一下我们的路由是否已经可以正常...
https://router.vuejs.org/zh/installation.html#%E7%9B%B4%E6%8E%A5%E4%B8%8B%E8%BD%BD-cdn 1.安装 npm install vue-router@4 2. vite.config.js(配置别名) import{defineConfig}from'vite' importvuefrom'@vitejs/plugin-vue' ...
vite-plugin-external-cdn 一款将依赖转换为 cdn 的 vite 插件,脱胎于 vite-plugin-cdn-import,由于 vite-plugin-cdn-import 停止维护,fork 了一份到本地,并对一些 bug 做了修复,做了开源。 安装: pnpmaddvite-plugin-external-cdn-D 使用: // vite.config.jsimportreactRefreshfrom"@vitejs/plugin-react-re...
cdn({ modules: [{ name: "vue", relativeModule: "vue.global.prod.min.js" }, "vue-router", "vue-demi", "pinia", "axios" ], resolve: defineResolve({ name: "resolve:custom", setup({ extra }) { const baseURL = "https://cdn.staticfile.net/"; const { version, name, relative...
npm i vite-plugin-cdn-import-rely --save-dev Usage Example importimportFromCDNfrom"vite-plugin-cdn-import-rely";exportdefaultdefineConfig({plugins: [importFromCDN( [ {name:"element-plus",var:"ElementPlus",path:"index.full.min.js",relys: ["vue"], }, {name:"element-plus/es/locale/lang...