全部学科
Python全栈
python
NodeJS全栈
nodejs
📝 1 篇文章 6 道配套习题

静态资源处理专题

专题说明

本专题介绍 Vite 处理静态资源的方式,包括图片导入、public 目录使用等。

学习目标

  1. 掌握图片与媒体资源的导入方式
  2. 理解 public 目录的作用与使用场景
  3. 区分静态资源与动态资源的处理差异

学习内容

  • 图片与媒体资源导入:import 导入、URL 引用
  • public 目录与静态资源:无需构建的资源存放

学习建议

实际导入图片资源,观察构建后的文件名变化,理解 Vite 的资源处理机制。

📝 配套习题(6 题)

💡 参考答案在文末
判断题
1

在 Vite 项目中,可以通过 import 语句导入图片等静态资源。

A

B

2

public 目录中的资源在构建时会被原样复制到输出目录,不会经过 Vite 处理。

A

B

单选题
3

在 JS 中导入一个图片资源,导入的值是什么?

A

图片的 Base64 编码字符串

B

图片文件的二进制数据

C

图片资源的 URL 路径

D

图片文件的完整路径

4

public 目录中的 favicon.ico 文件,在代码中应该如何引用?

A

import favicon from '/public/favicon.ico'

B

使用路径 '/favicon.ico' 直接引用

C

import favicon from './public/favicon.ico'

D

使用路径 './favicon.ico' 引用

填空题
5

导入图片资源并使用的示例代码:import ____________ from './logo.png'

6

Vite 项目中存放不参与构建处理的静态资源的目录是 ____________

参考答案
1.正确 2.正确 3.C 4.B 5.logo 6.public
想在手机上练习这套专题?
使用微信卷王开发者小程序,打开首页顶部扫码功能识别二维码
← 上一个专题 静态站点生成SSG专题
下一个专题 → 高级SSR实现专题
扫码体验小程序
加载中
想在手机上刷题学习?
使用微信卷王开发者小程序,打开首页顶部扫码功能识别二维码