javascript - Optimizing CSS/JS imports for Static website using common a JS document -
coming server side programming background, might noob question.
currently have css laid out below , js in similar fashion.
<link type ="text/css" href="css/bootstrap.min.css" rel="stylesheet"> <link type="text/css" href="css/custom.css" rel="stylesheet"> <link type="text/css" href="css/template.css" rel="stylesheet">
but have around 40-50 html pages remaining coded , dropped in , pages share same css/js more or less.so, how avoid boilerplate typing.can below
var navbar = ['<div class="hi-icon-wrap hi-icon-effect-9 hi-icon-effect-9a" text-align="">', '<a class="hi-icon hi-icon-fa-home" style="text-decoration:none!important" href="index" title="blah"></a>home', '<a class="hi-icon hi-icon-fa-wrench" style="text-decoration:none!important" href="tools" title="blah"></a>tools', '<a class="hi-icon hi-icon-fa-folder-o" style="text-decoration:none!important"href="blog" title="blah"></a>blog', '<a class="hi-icon hi-icon-fa-user" style="text-decoration:none!important" href="about" title="blah"></a>about me', '</div>'].join('\n')
i mean using same logic print out <script>
, <link>
tags?if so, have disadvantages or there better way it.
since using jekyll, should use includes feature built in.
all have _includes
folder in root folder of project, , add js-css.html
file in there <script>
, <link>
tags reference js , css files.
then in template, have:
{% include js-css.html %}
in <head>
tag everywhere.
Comments
Post a Comment