我使用express,bootstrap-styl,stylus,nib和pug / jade作为页面
我的服务器代码
var express=require('express')
var boostrap=require('bootstrap-styl')
var stylus=require('stylus')
var nib=require('nib')
var pug=require('pug')
var app=express()
app.use(express.static('public'));
app.use(stylus.middleware({
src: 'public',
compile: compile
}))
app.set('views', './views');
app.set('view engine', 'pug');
function compile(str,path){
return stylus(str)
.set('filename',path)
.set('compress',true)
.use([boostrap(),nib()])
}
app.get('/',function(req,res){
//res.send('Hello Hola')
res.render('index',{msg:'my message'})
})
app.listen(80)
我的玉码
doctype html5
html
head
link(rel='stylesheet',href='/style/style.css')
body
=msg
input(type=text)
button.btn.btn-warning(type='button') Click
我的按钮没有使用bootstrap设计,实际上是bootstrap-styl吗?
我的不好,我没有在style.styl
导入bootstrap@import 'nib'
@import bootstrap
body
background-color red
答案 0 :(得分:-1)
尝试使用bootstrap-stylus而不是bootstrap-syl ......
`var bootstrap = require('bootstrap-stylus'), stylus = require('stylus'); function compile(str, path) { return stylus(str) .set('filename', path) .use(bootstrap()); } app.use(stylus.middleware({ src: __dirname + '/public', compile: compile }));`