import{o as s,c as a,a as e}from"./app.c38d1953.js";const n='{"title":"样式","description":"","frontmatter":{},"headers":[{"level":2,"title":"介绍","slug":"介绍"},{"level":2,"title":"unocss","slug":"unocss"}],"relativePath":"guide/design.md","lastUpdated":1721206001124}',t={},p=e('

样式

介绍

主要介绍如何在项目中使用和规划样式文件。

默认使用 less 作为预处理语言,建议在使用前或者遇到疑问时学习一下 Less 的相关特性。

项目中使用的通用样式,都存放于 src/style/ 下面。

.\n├── index.less # 入口\n├── theme.less # 主题相关\n├── var.css  # css变量\n└── variables.module.less # less变量\n\n

全局注入

variables.module.less 这个文件会被全局注入到所有文件,所以在页面内可以直接使用变量而不需要手动引入。

var.css 则是注入到根元素,所以在每个地方也都能用到。

unocss

项目中使用了 unocss,具体参见文件使用说明。

可能没有用到人会觉得用起来很不习惯,但就个人而言,用起来还是挺香的。减少了很多不必要的麻烦

语法如下:

<div class="relative w-full h-full px-4"></div>\n
',12);t.render=function(e,n,t,l,o,c){return s(),a("div",null,[p])};export default t;export{n as __pageData};