标签: stylus

Stylus 语法 - 导入从哪里来?

我有一个名为“quasar.styl”的文件:

@import './quasar.variables'
@import '~quasar-styl'
Run Code Online (Sandbox Code Playgroud)

当它被 webpack 使用 styl-loader 处理时,我收到以下错误:

failed to locate @import file ~quasar-styl.styl
Run Code Online (Sandbox Code Playgroud)

我有这种感觉,关于手写笔有些东西我不明白。它会在哪里寻找文件“~quasar-style”?

该文件来自一个正在运行的样板类星体应用程序,并且应用程序目录中的任何位置都没有调用的文件quasar-style,尤其是node_modules,这是我收集波浪号告诉它要查看的地方。

有任何想法吗?

更新:我在这里上传了类星体样板项目: https ://repl.it/@jmbldwn/Quasar-Boilerplate-2

它无法在 repl.it 上运行,因为它需要 quasar-cli,但您可以在那里看到它生成的所有文件。

stylus webpack webpack-dev-middleware quasar-framework

7
推荐指数
2
解决办法
4212
查看次数

如何让 Stylus 看到已经在其他作用域初始化的变量?

在SASS中:

.DocumentationArticle

  $DocumentationArticle-Heading__TopLevel--Selector: null

  &-Heading
    &__TopLevel
      $DocumentationArticle-Heading__TopLevel--Selector: &
    &__Section
      @debug($DocumentationArticle-Heading__TopLevel--Selector) // OK: ".DocumentationArticle-Heading__TopLevel"
Run Code Online (Sandbox Code Playgroud)

在 Stylus 中,变量值已更改,此更改仅在更改的范围内可见:

.DocumentationArticle

  DocumentationArticle-Heading__TopLevel--Selector = null

  &-Heading
    &__TopLevel
      DocumentationArticle-Heading__TopLevel--Selector = selector()
    &__Section
      warn(DocumentationArticle-Heading__TopLevel--Selector) // null!
Run Code Online (Sandbox Code Playgroud)

如何使DocumentationArticle-Heading__TopLevel--Selector新值在&__Section范围内可见?

小提琴

stylus

7
推荐指数
0
解决办法
148
查看次数

针对Stylus的PHP预处理器脚本/库?

是否有适用于PHP的"css手写笔"解析器/库?

如果不是,请提出类似的建议,如果不是更好.可能是一个轻量级的库,使你的生活编码css,在PHP中更容易.

Stylus语法从常规CSS脚本中删除所有冒号,分号,括号和大多数括号.它的简洁和优雅让我想起了Lisp.更令人惊奇的是,Stylus还会在同一个文件中接受常规的CSS语法,从而减少多个贡献者之间可能存在的摩擦.

css php stylus

6
推荐指数
2
解决办法
2472
查看次数

在stylus css中更改部分文本的颜色?

我想用手写笔改变文本串中只有一个单词的颜色即

#copy
   h1 Our new site will be ready soon..
Run Code Online (Sandbox Code Playgroud)

手写笔代码是

  h1
   font-weight bold
   color white
Run Code Online (Sandbox Code Playgroud)

我只是想将h1短语"我们的"中的第一个字母的颜色改为黄色,我怎么能在手写笔中实现这一点,谢谢:)

css stylus

6
推荐指数
2
解决办法
1万
查看次数

手写笔,请参阅变量名称和值

我想要...

我想尝试做这样的循环

my-red = #fcc
my-blue = #ccf

for color in my-red, my-blue
  .{color}
    color x
Run Code Online (Sandbox Code Playgroud)

我希望它输出

.my-blue {
  color: #ccf;
}
.my-red {
  color: #fcc;
}
Run Code Online (Sandbox Code Playgroud)

我似乎无法同时获得变量名称和值

我试过了...

my-blue = #ccf
my-red = #fcc

for x in 'my-blue' my-red
  .{x}
    color x
Run Code Online (Sandbox Code Playgroud)

但我只是得到类名或颜色名称(取决于我是否使用字符串作为变量名来迭代)

.my-blue {
  color: "my-blue";
}
. {
  color: #fcc;
}
Run Code Online (Sandbox Code Playgroud)

stylus

6
推荐指数
1
解决办法
4527
查看次数

express.js + stylus:自动手写笔编译不起作用

我正在使用stylus 0.37.0运行express.js 3.4.0我试图让express和stylus一起工作所以当我请求一个css文件实际上是一个其他地方的手写笔文件时,表达触发器手写笔来编译它然后服务它(相当标准我猜,因为我看到它在许多教程中工作).

我的文件结构:

myApp
  resources
    stylus
      style.styl
  public
    css
Run Code Online (Sandbox Code Playgroud)

我的app.js(只有相关的行):

app.use("/static", express.static(__dirname + "/public"));
app.use(stylus.middleware({
    src: __dirname + "/resources/stylus",
    dest: __dirname + "/public/css",
    debug: true,
    force: true,
}));
Run Code Online (Sandbox Code Playgroud)

根据我的阅读,请求/static/css/style.css应该导致表达生成此文件resources/stylus/style.styl,然后提供它.这不起作用.有效的是,如果我请求文件正确生成/style.css文件/public/css/style.css,但我得到了404.之后,我可以通过/static/css/style.css身体现在请求它.

有人可以建议任何解决这个问题的步骤吗?我错过了什么吗?

stylus node.js express

6
推荐指数
1
解决办法
7559
查看次数

Stylus CSS编译和Maven

有没有方便的方法,如何递归编译使用Maven构建的标准java Web应用程序中的所有Stylus样式表

我发现有一个lesscss-maven-plugin,但Stylus有类似的东西吗?

stylus maven

6
推荐指数
1
解决办法
459
查看次数

没有base64编码的Stylus内联SVG数据uri

如何在没有SVG被Base64编码的情况下使用Stylus预处理器在CSS中嵌入SVG数据uri ?

像这样:

background: url('data:image/svg+xml;utf8,<svg>[...]</svg>');
Run Code Online (Sandbox Code Playgroud)

而不是这个:

background: url('data:image/svg+xml;base64,PD94bWwg[...]');
Run Code Online (Sandbox Code Playgroud)

Normaly我曾经习惯stylus.url()嵌入图像,但它也会使用Base64编码SVG.

我想使用数据uris而不是外部文件来保存文件请求.我已经意识到Base64编码SVG实际上增加了字节而不是减小大小.

我找不到按原样嵌入SVG的方法.

css svg stylus node.js data-uri

6
推荐指数
2
解决办法
2260
查看次数

如何在Angular2 CLI项目中设置Stylus?

我想在Angular2 CLI项目中使用Stylus而不是标准CSS.我已经浏览了一下,找不到任何关于如何设置它的可靠来源.

stylus webpack angular-cli angular

6
推荐指数
1
解决办法
2015
查看次数

Web - 如何区分手指触摸和手写笔触摸?

我正在尝试制作一个绘图网络应用程序。我想用手写笔绘画并用手移动画布。如何区分这两者?

我在 MDN 官方文档中没有发现任何有希望的内容。

html javascript drawing stylus web

6
推荐指数
1
解决办法
1741
查看次数