页面专用脚本与样式
Methanol 内置支持页面级专属资源。它会自动检测并加载与页面文件同名且位于同目录下的脚本及样式文件。
机制详解
示例结构:
pages/
guide/
components.mdx
components.css
components.js
当渲染 /guide/components 路由时,系统将自动把 components.css 与 components.js 注入至页面的 <head> 中。
支持的文件扩展名
样式:
.css
脚本:
.js,.mjs,.cjs.ts,.mts,.cts
使用示例
pages/
about.mdx
about.css
about.ts
在这种配置下,about.css 与 about.ts 将仅针对 /about 路由加载。
注意事项
- 路径解析: 资源路径解析以页面文件所在的父目录为基准。
- 全局资源: 全局资源(如
pages/style.css、pages/index.js/ts)依然对所有页面生效,并与页面专属资源并存。