使用Vite和Vue,我希望在运行构建时不生成包含SVG和GIF文件的assets文件夹(而不是复制SVG代码并将其作为占位符粘贴到Vue JS文件中),从而获得单个的JavaScript文件.

有没有办法做到这一点?我已经找了一天了,但没有找到任何答案.如有任何帮助,我们不胜感激.然而,GIF似乎是自动内联的.

推荐答案

假设您运行的是Vite版本5,您可以考虑为build.assetsInlineLimit选项设置一个较高的数字:

小于此阈值的导入或引用的资源将内联为Base64 URL,以避免额外的http请求.

SVG和GIF被视为assets资源 ,因此将此选项设置为大量应该内联大多数assets资源 .需要VITE 5才能将其作为SVG inline was only introduced in this version运行.

/* vite.config.js */
import { defineConfig } from 'vite';

export default defineConfig({
  build: {
    assetsInlineLimit: Number.MAX_SAFE_INTEGER,
  },
});

Example project in StackBlitz

Javascript相关问答推荐

如何访问react路由v6加载器函数中的查询参数/搜索参数

RxJS setTimeout操作符等效

如何修复循环HTML元素附加函数中的问题?

我试图实现用户验证的reduxstore 和操作中出了什么问题?

硬币兑换运行超时

从WooCommerce Checkout Country字段重新排序国家,保持国家同步

如何修复(或忽略)HTML模板中的TypeScript错误?'

使用原型判断对象是否为类的实例

使用Google API无法进行Web抓取

从页面到应用程序(NextJS):REST.STATUS不是一个函数

如何将未排序的元素追加到数组的末尾?

为什么这个.add.group({})在教程中运行得很好,但在我的游戏中就不行了?

使用auth.js保护API路由的Next.JS,FETCH()不起作用

Next.js中的服务器端组件列表筛选

在Puppeteer中使用promise进行日志(log)记录时出现TargetCloseError

Chrome上的印度时区名S有问题吗?

如何将对象推送到firestore数组?

如何格式化API的响应

ReactJS Sweep Line:优化SciChartJS性能,重用wasmContext进行多图表渲染

如何在不获取其子元素的文本内容的情况下获取元素的文本内容?