Skip to content

CSS 预处理器

JsView的CSS预处理器是从Vue参考而来,主要支持Sass、Less、Stylus等。

1. 预备知识

如果你想了解CSS预处理器的基础知识,可以通过自己的方式或下方的链接了解其中一个或几个相关知识:

2. 安装

sh
cd [jsview-project] 
npm install --save-dev sass sass-loader@10.2.1

然后你就可以在 *.vue 文件中这样来使用:

vue
<style scoped lang="scss">
</style>

::::

注意

为了加速CSS的渲染,<style scoped> 中的 scoped 关键字是必须的,否则将不处理CSS的继承功能。

3. 常用功能

注意

JsView只支持CSS .class 形式的类选择器,所以在预处理器中也只支持类选择器。

**. 功能一览

::::

!!!include(src/guide/4.standard-features/css-proprocessor-features/01.comments.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/02.operators.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/03.variables.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/04.conditionals.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/05.iteration.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/06.methods.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/07.extends.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/08.nesting.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/09.mixins.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/10.maps.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/11.keyframes.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/12.importing.md)!!! !!!include(src/guide/4.standard-features/css-proprocessor-features/13.others.md)!!!