【问题标题】:Stylus Middleware not compiling CSS手写笔中间件不编译 CSS
【发布时间】:2014-04-28 14:20:51
【问题描述】:

你能帮我解决一下Stylus Middleware吗?我不能让他编译css文件。

这是我的 app.js 代码:

// Module dependencies
var express = require('express');
var stylus = require('stylus');
var nib = require('nib');
var logger = require('morgan');

// Compile function - check this function online
function compile(str, path){
return stylus(str)
.set('compress', true)
.use(nib())
}

// Stylus Middleware (functions that handles request)
app.use(logger('dev')); //replaces your app.use(express.logger());
app.use(stylus.middleware({ 
src: __dirname + '/stylus',
dest: __dirname + '/public',
compile: compile
}))
app.use('/static', express.static(__dirname + '/public/static'));

我的根目录结构如下:

用户应用

app.js

手写笔

styles.styl

公开

css

我已经尝试了之前发布的所有内容,但没有运气。我有点卡住了,所以如果你有任何建议,那就太好了。谢谢

【问题讨论】:

    标签: javascript node.js express pug stylus


    【解决方案1】:

    问题可能是 src 文件夹需要与 dest 文件夹具有相同的文件夹结构,反之亦然[这是一个常见的错误]。我的意思是,如果您将 th src 设置为 __dirname + '/stylus' 并将 dest 设置为 __dirname + '/public' 并且您在 /stylus 中有一个名为 css 的文件夹,然后是样式 [ 即 ./stylus/css/style1.styl ,那么 dest 需要是 ./public/css/style.css 。我想我自己也为此苦苦挣扎。在 app.js 中检查我的结构和代码。

    app.js

    function compile(str, path) {
      return stylus(str)
        .set('filename', path)
        .use(nib())
        .set('compress', true)
        .import('nib');
    }
    
    app.use(stylus.middleware({
      src: __dirname + '/resources',
      dest: __dirname + '/public',
      debug: true,
      force: true
    }));
    app.use(express.static(path.join(__dirname, 'public')));
    

    【讨论】:

    • 我成功了! Tnx radubogdan 和 Peter Lyons,我已经采纳了你的两个建议。
    • 呵呵。我很高兴 :) 那么你可以对这两个答案都投赞成票 ;)
    【解决方案2】:

    我的猜测是因为你省略了filename 设置,如果你有任何无法正确解析路径的@import@require 语句,则编译失败。试试这个:

    // Compile function - check this function online
    function compile(str, path){
      return stylus(str)
      .set('filename', path)
      .set('compress', true)
      .use(nib());
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-08-13
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多