VitePress支持.awebp格式文件

149 阅读1分钟

image.png

项目场景:

VitePress做静态网站,要使用.awebp格式的图片文件。

问题描述

VitePress 执行 build 时的错误内容

build error:
[vite:build-import-analysis] [plugin vite:build-import-analysis] docs/learn/assets/24081702/66c0afb1e26bbed3d993e668.awebp: Failed to parse source for import analysis because the content contains invalid JS syntax. You may need to install appropriate plugins to handle the .awebp file format, or if it's an asset, add "**/*.awebp" to `assetsInclude` in your configuration.

image.png

原因分析:

VitePress默认不支持.awebp格式文件。

解决方案:

在配置文件.vitepress/config.mjs中添加以下配置

// .vitepress/config.ts
import { defineConfig } from 'vitepress'

export default defineConfig({
  vite: {
    assetsInclude: ['**/*.awebp']
  }
})

再去看看错误提示中有一句话

or if it's an asset, add "**/*.awebp" to assetsInclude in your configuration.

发现已经提示了,因不知道有vite这个配置项,第一眼没看懂。


VitePress搭建的个人网站:blog.mosong.cc