將包含文件傳遞到Handlebars佈局

我正在使用Node.js，Express 4和Handlebars模板處理器。我使用Handlebars渲染的一些頁面視圖有幾個kB靜態內聯SVG代碼。有沒有簡單的乾淨方法將SVG代碼放入單獨的文件中以包含在Handlebars佈局模板中？理想情況下，這包括文件將有一個.svg擴展名，但.hbs是可以接受的。將包含文件傳遞到Handlebars佈局

來源

2017-02-11 natesrc

昨天我解決同樣的問題。我完成了將svg文件加載到字符串中，然後將其傳遞給句柄模板。

var svgTemplate = fs.readFileSync('./public/app/build/images/spriteAll.svg', 'utf8'); 

var express = require('express'), 
    router = express.Router(); 

router.get('/', function (req, res) { 
    res.render('main', { 
     svgTemplate: svgTemplate 
    }); 
});

//其中main.hbs包含： ...

<body class="ng-cloak"> 
    <div class="inline-svg"> 
     {{{svgTemplate}}} 
    </div> 
.... 
</body>

來源

2017-02-14 17:56:47 Romick

Romick我喜歡你的解決方案比使用Handlebars partials包含一個文件更好。您的解決方案允許包含文件的.svg擴展名。 – natesrc

您可以在項目中創建一個靜態資產文件夾（例如/public），然後將include it with Express：app.use(express.static('public'));放入您的.svg文件。

然後在你的車把文件只需添加SVG，你會在一個普通的HTML項目，像<img src="your.svg">

來源

2017-02-11 08:28:37

Ben使用img標籤鏈接SVG文件限制了CSS設計SVG圖像的風格。在HTML中使用內聯SVG將SVG加載到DOM中，使其可用於使用CSS進行重新樣式化。我正在尋找一種方法將內聯SVG放入Handlebars包含文件中以避免臃腫的標記。 – natesrc

你可以嘗試handlebars-partial-file，包括文件的內容作爲把手部分。

來源

2018-01-15 16:43:44 Michio

將包含文件傳遞到Handlebars佈局

回答

相關問題