I am currently using express and handlebars for my project. It is my first time of using handlebars and I cannot figure out how to properly reference the position of my css and js files
My current project structure is like below
- test (root)
-views
-js
-some JS files
-css
-some css files
-layout
-main.handlebars
- servers.js (my server)
so I did following in my main.handlebars layout file
<!Doctype html>
<html>
<head>
<title></title>
{{#each css}}
<link rel="stylesheet" href="../css/{{this}}">
{{/each}}
</head>
<body>
{{{body}}}
{{#each js}}
<script src="../js/{{this}}"></script>
{{/each}}
</body>
</html>
And inside {{this}}, index.css goes in for css and index.js goes in for js.
But this gave Cannot GET 404 http://localhost:8000/js/index.js error. So I thought maybe handlebars look from the root somehow. so I tried
<!Doctype html>
<html>
<head>
<title></title>
{{#each css}}
<link rel="stylesheet" href="views/css/{{this}}">
{{/each}}
</head>
<body>
{{{body}}}
{{#each js}}
<script src="views/js/{{this}}"></script>
{{/each}}
</body>
</html>
But this gave Cannot GET 404 http://localhost:8000/views/js/index.js error when it looks to be the correct position of the file.
What is the correct way of referencing the js and css file in handlebars?