wintersmith 옥 템플릿의 루트 상대 경로 대체

Question

wintersmith 템플릿의 루트 상대 경로 대신 링크에서 동적 상대 경로를 사용할 수있는 방법이 있습니까?

미리보기 빌드 서버가 웹 사이트를 임의의 깊은 하위 폴더에 중첩하므로 예를 들어 src="/scripts/main.js"과 같은 루트 리얼티 링크를 사용할 수 없습니다. 프로덕션 서버의 모든에

/stage/workspace/build/scripts/main.js 
/stage/workspace/build/index.html 
/stage/workspace/build/about/index.html 

은 상대 링크가 잘 작동 루트 있도록 루트 URL 아래에있을 것입니다,하지만 난 우리의 준비 미리 서버에 볼 수 있도록 구축도 싶습니다. 내 비취 템플릿에 링크를 설정하여 상대 링크 (예 : ../scripts/main.js 약 us 페이지)의 홈 페이지에서 scripts/main.js 인 스크립트 링크를 항상 사용할 수 있습니다. 두 페이지 모두 동일한 옥 (jade) 템플리트를 사용하고 템플리트는 각 페이지의 상대 링크가 무엇인지 알아 내야합니다.

wintersmith의 트리에있는 내용을 기반으로 옥 (Jade) 템플릿에서 사용할 수있는 상대 경로 가져 오기 기능이 있습니까? 내가 사용하고

Answer 1

하나 개의 솔루션 빌드에 대해 다른 설정을 사용하는 것입니다,

을 이렇게 대신 기본 "config.json"을 사용하는 엉망 빌드 설치 특별히위한 설정을위한 것입니다 당신이 그 (것)들을 설치되고 싶어하고, 작업이 완료되면, 그냥 실행 방법 "config.build.json" 설치 URL을 :

이

wintersmith build -c config.build.json 

(다시, 이것은 아마 중 하나입니다 전, 구축 솔루션, 배포를 위해 더 나은 솔루션을 지속적으로 찾고 있습니다)

Answer 2

나는 모든 생성 된 HTML 파일을 통해 걸어 자신의 상대 변형을 내부에 포함 된 링크 변환 특별 후 처리 빌드 단계를 사용합니다. 이 템플릿하지만 최종 산출물을 수정하지 않는 한 어떤 템플릿 언어 (예를 들어, nunjucks)와 함께 작동

이 방법.

wintersmith의 라이브 미리보기 서버에서는 작동하지 않습니다.

나는 Cheerio HTML 파서를 사용합니다.

핵심 기능은 다음과 같이 간다 : 스크립트 태그를 생성하는

var cheerio = require("cheerio"); 
var fs = require("fs"); 
$ = cheerio.load(fs.readFileSync(expandFileName("build/test.html"), 'utf-8')); 

// change all links in the cheerio document from absolute to relative. 
// document's absolute location is supposed to be /test/test.html 
rebaseDocument("/test/test.html", $); 

fs.writeFileSync(expandFileName("build/test.new.html"), $.html()); 
return; 

function rebaseDocument(documentLocation, $) { 
    debugLog(documentLocation); 
    rebaseElements(documentLocation, $, "a", "href"); 
    rebaseElements(documentLocation, $, "link", "href"); 
    rebaseElements(documentLocation, $, "script", "src"); 
    rebaseElements(documentLocation, $, "img", "src"); 
} 

function rebaseElements(documentLocation, $, tagName, attributeName) { 
    $(tagName).each(function() { $(this).attr(attributeName, rebaseLink(documentLocation, $(this).attr(attributeName))); }); 
} 

function rebaseLink(documentLocation, link) { 
    if (link == null) 
    return link; 

    // check if link denotes absolute hyperlink. If so, nothing to do here 
    // absolute hyperlink is either scheme:// or protocol relative url // 
    if ((new RegExp('^([a-z]+://|//)')).test(link)) 
    return link; 

    // check another special forms of absolute hyperlinks 
    if (link.substring(0, 7) == "mailto:") 
    return link; 

    // if link is already relative, nothing to do 
    if (link.charAt(0) != '/') 
    return link; 

    if (documentLocation.charAt(0) != '/') 
    documentLocation = '/' + documentLocation; 

    var path = require("path"); 
    var documentName = path.basename(documentLocation); 
    var from = path.dirname(documentLocation); 
    var newLink = path.relative(from, link).replaceAll("\\", "/"); 

    // reduce 'document.htm#anchor' to '#anchor' 
    if (newLink.slice(0, documentName.length + 1) == documentName + '#') 
    newLink = newLink.slice(documentName.length); 

    return newLink; 
}