方案一:(推荐)使用 CDN 管理插件vite-plugin-cdn-import npm install vite-plugin-cdn-import --save-dev // vite.config.ts import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' // 文档的用法会报错, 要这样引入才可以 import { autoComplete, Plugin as importToCDN } from '...
import compression from 'vite-plugin-compression'; import imagemin from 'vite-plugin-imagemin'; export default defineConfig({ // ... plugins: [react(), compression(), imagemin()] // ... }); 4. CDN 优化(外网环境) 通过vite-plugin-cdn-import插件能够将一些依赖使用 cdn 加载,从而降低包的大...
如果是发版则添加)const{importMap,isAdd}=optionsreturn{name:'vite-plugin-add-importmap',transformIndexHtml(html:string){if(isAdd===false||!importMap)returnhtml// 这里采用JSON.stringify转化成标准的jsonconstcdnUrlStr=JSON.stringify(importMap)// 构造importmapconstscriptTag=`{ "imports...
npm install vite-plugin-cdn-import --save-dev import importToCDN, { autoComplete } from 'vite-plugin-cdn-import'; // export default ({ mode }) => { // const envUrl = loadEnv(mode, process.cwd()).VITE_BASE_URL; // console.log(envUrl) // } importToCDN({ modules:[ { name: ...
// 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`,},],}),],} ...
// vite.config.js import cdn from 'vite-plugin-cdn-import' export default { 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`, }, ], }), ...
vite-plugin-external-cdn vite-plugin-external-cdn 一款将依赖转换为 cdn 的 vite 插件,脱胎于 vite-plugin-cdn-import,由于 vite-plugin-cdn-import 停止维护,fork 了一份到本地,并对一些 bug 做了修复,做了开源。 安装: pnpmaddvite-plugin-external-cdn-D ...
BASE_URL='/api' 此外import.meta.env中有几个固定值: MODE: {string} 应用运行的模式("development" 或 "production")。 BASE_URL: {string} 部署应用时的基本 URL。他由vite.config中的base配置项或build指令中的--build决定。 PROD: {boolean} 应用是否运行在生产环境。
注入import.meta.env.LEGACYenv 变量,它只会true在旧版生产版本中,false在所有其他情况下。 vite.config.js配置如下,将自动生成babel、profill之后的代码: 代码语言:javascript 复制 importlegacyfrom'@vitejs/plugin-legacy'exportdefaultdefineConfig({plugins:[legacy({targets:['defaults','not IE 11']})} ...
cnpm i vite-plugin-cdn-import --save-dev 1. 引入到vite.config.ts import importToCDN, { autoComplete } from "vite-plugin-cdn-import"; 1. 使用在插件中 plugins: [ vue(), //vue AutoImport({ //自动引入vue组件 插件 imports: ["vue"], ...