Why is bootstrap source maps not loading on website

Question

I have a index.html that is served by a node.js server, unfortunately I am having trouble loading bootstrap when I use my local downloaded bootstrap library; when I use bootstrap served from the web it works fine.

Website works when bootstrap included like this

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>  

Website doesn't work when bootstrap included like this

<link rel="stylesheet" type="text/css" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
<link type="text/json" href="node_modules/bootstrap/dist/css/bootstrap.min.css.map">
<script type="text/javascript" src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<link type="text/json" href="node_modules/bootstrap/dist/js/bootstrap.min.js.map">

When I look at the node server logs, I see that the source map is failing to be served to the client.

/node_modules/bootstrap/dist/js/bootstrap.min.js.map
_http_outgoing.js:464
    throw err;
    ^

TypeError [ERR_HTTP_INVALID_HEADER_VALUE]: Invalid value "undefined" for header "Content-type"
    at ServerResponse.setHeader (_http_outgoing.js:473:3)
    at C:\Users\Dwight\work\trainingwebsite/Server.js:109:20
    at FSReqWrap.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:53:3)

I've tried using bootstrap 4.0.0 and 4.4.1 but both exhibit the same behaviour.

Why is this happening only when I use my local bootstrap? I've tried setting different types for the source map include but I keep getting the same error...

Update: When I disable source maps on google chrome settings, the site loads fine with local bootstrap.

Answer 1

Try changing it to:

<link rel="stylesheet" type="text/css" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
<link href="node_modules/bootstrap/dist/css/bootstrap.min.css.map">
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script href="node_modules/bootstrap/dist/js/bootstrap.min.js.map">