Jade template in Node.JS/Express app can't find external Javascript file?
<p>I have a Node.JS/Express app that uses the Jade template engine.  I have a Javascript file that is in the directory immediately above my <em>views</em> directory that contains my Jade views.  Given the code below, I believe that the view <em>should</em> be able to find referenced server-side <em>Javascript file named</em> <code>common_routines</code>, but when the view is requested I get a 404 error saying that the external Javascript file could not be found.  This confuses me because I thought Jade templates execute server side, so why would this trigger a <code>404 error</code> from the Jade <code>render()</code> call?</p>

<p><strong>Here is the Jade view:</strong></p>

<pre><code>block content
    script(src="../common_routines.js")
    div(style="padding:5px")
        h4 #{product.name}
    if (product.brand != null)
        p Brand: #{product.brand}
    div(class="img_and_desc")
        img(src=product.imageUrl, class="product_image", align="left")
        if (product.minimumPrice == product.maximumPrice)
            p Price: #[strong #{product.minimumPrice}]
        else
            p Price: #[strong #{product.minimumPrice}] to #[strong #{product.maximumPrice}]
        if (product.cashBack &gt; 0)
            p Cash Back amount: #[strong #{product.cashBack}]
        if (product.freeShipping)
            p(class="text-emphasized-1") *Free Shipping!
        if (product.onSale)
            p(class="text-emphasized-2") Discounted Item
</code></pre>

<p>Here is a snippet of the call from the route file that renders the view, where the <code>if (err)</code> branch is triggered:</p>

<pre><code>           res.render(
                'ajax-product-details',
                locals,
                function (err, html) {
                    if (err)
                    // A rendering error occurred.
                        throw new Error("Rendering error(type:" + err.type + ", message: " + err.message);
                    else {
                        // Success. Send back the rendered HTML.
                        res.send(html);
                        return;
                    }
                });
</code></pre>

<p>Here is the error I see in the WebStorm debugger Console window pane.  Notice that it shows the file reference as <strong>/common_routines.js</strong> <em>without</em> the preceding ".." relative directory reference, despite the fact that preceding ".." relative directory reference is plainly visible in the Jade file reference <code>("script(src="../common_routines.js")):</code></p>

<pre><code>[Express][127.0.0.1][GET][DESKTOP] 2016-07-20T10:07:34.940Z /common_routines.js?_=1469009245957
(development error handler) Status code(404) message: Not Found
</code></pre>

<p>Here is the common_routines.js content:</p>

<pre><code>function truncateString(str, maxLen)
{
    if (str.length &gt; maxLen)
        return str.substring(0, maxLen - 1) + '&amp;hellip';
    return str;
}

module.exports =
{
    truncateString: truncateString
}
</code></pre>

<p>As I said, <em>common_routines.js</em> is in the directory immediately above the Jade view, so is this external file reference invalid for some reason?:</p>

<pre><code>script(src="../common_routines.js")
</code></pre>