Express/Jade의 관련 링크

Question

현재 제이드 템플릿에 현재 URL을 기준으로 하이퍼 링크 (<a>)를 쓰려고합니다.

는 예를 들어, 내보기 http://localhost/cats에서 호출과는 다음과 같습니다 : 나는 시도했다 http://localhost/cats/fluffy

것 대신에,

링크를 클릭

extends layout 

block content 
    a(href='fluffy') Fluffy 

, 그것은 http://localhost/fluffy에 나를 소요 :

• a(href='./fluffly')
• a(href='/fluffy')
그냥 a(href='cats/fluffy')처럼, 절대 경로를 쓰고에서만 작동하는 것에 대해서는

. 분명히 할 수있는 더 좋은 방법이 있습니다. 익스프레스의 기본 동작은 /cats 및 /cats/을 치료하는 것입니다

Answer 1

당신은 이미 /cats을 열 때 fluffy에 대한 상대 링크가 배경 /fluffy :

비트 당신을 이끌 것이라고 예상 할 수있어, 자신을 발견으로 같은, 그리고 둘 다 같은 경로를 트리거합니다.

당신이 중 하나는 링크 (특히 상대 링크)를 만들 때 계정으로 가져가, 또는 두 개의 경로로 처리하는 익스프레스 말할 필요 :

app.enable('strict routing'); 

app.get('/cats/', function(req, res) { 
    ... 
}); 

이 /cats/ 일치합니다,하지만 /cats. 물론 경로 정의에서 후행 슬래시를 사용하지 않으면이 동작이 취소됩니다.

Answer 2

당신이 gulp-jade를 사용하는 경우, 믹스에 gulp-data을 추가하고이 코드를 사용합니다

var jade = require('gulp-jade'); 
var data = require('gulp-data'); 

gulp.src('**/*.jade') 
    .pipe(data(function (file) { 
    var relativePath = file.history[0].replace(file.base, ''); //e.g. about/index.jade 
    var depth = (relativePath.match(/\//g) || []).length; //e.g. 1 
    var relativeRoot = new Array(depth + 1).join('../'); //e.g. ../ 
    return { 
     relativeRoot: relativeRoot 
    }; 
    })) 
    .pipe(jade()) 

이 본질적으로 당신에게 당신의 jade 템플릿에 relativeRoot을 줄 것이다 : <nothing>는 또는 ../는 여러 번으로 반복 기본 폴더를 기준으로 중첩 된 디렉토리 수입니다.

그런 다음 템플릿에서 : 디스크에 절대 경로 (

link(rel='stylesheet', href= relativeRoot + 'assets/main.css') 

그 file.history가 생성되는 방법을 여기서/완전히 잘 모르겠지만, 내 경우에는 [0]은 원래 파일 이름에 지적)