Problem implementing OpenLayers with

This is my complete View:


    @{
        ViewBag.Title = "Home";
    }
    
    <div style="width:100%; height:100%" id="map"></div>
    <script defer="defer" type="text/javascript">
        var map = new OpenLayers.Map('map');
        var wms = new OpenLayers.Layer.WMS("OpenLayers WMS",
            "http://vmap0.tiles.osgeo.org/wms/vmap0", { layers: 'basic' });
        map.addLayer(wms);
        map.zoomToMaxExtent();
    
    </script>

But when I run it nothing I can’t see the map.

I made a HTML page in Notepad that looks like this:


    <html>
    <head>
      <title>OpenLayers Example</title>
        <script src="http://openlayers.org/api/OpenLayers.js"></script>
        </head>
        <body>
          <div style="width:100%; height:100%" id="map"></div>
          <script defer="defer" type="text/javascript">
            var map = new OpenLayers.Map('map');
            var wms = new OpenLayers.Layer.WMS( "OpenLayers WMS",
                "http://vmap0.tiles.osgeo.org/wms/vmap0", {layers: 'basic'} );
            map.addLayer(wms);
            map.zoomToMaxExtent();
          </script>
    
    </body>
    </html>

And it works.

I installed OpenLayers from NuGet and if I select OpenLayers and press F12 (‘Go To Definition’ it opens up OpenLayers.js so it seems to have been downloaded correctly).

The complete generated code:


    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>FIKA - Home</title>
    
    
        <link href="/Content/css?v=bxomq82-FU9mU3eDX6m-kca-a2PFEz0RK2Z7mS-QmnY1" rel="stylesheet"/>
    
        <script src="/bundles/modernizr?v=wBEWDufH_8Md-Pbioxomt90vm6tJN2Pyy9u9zHtWsPo1"></script>
    
    
    </head>
    <body>
        
        <div class="container body-content">
            
    
    
    <div style="width:100%; height:100%" id="map"></div>
    <script src="http://openlayers.org/api/OpenLayers.js"></script>
    <script defer="defer" type="text/javascript">
        var map = new OpenLayers.Map('map');
        var wms = new OpenLayers.Layer.WMS("OpenLayers WMS",
            "http://vmap0.tiles.osgeo.org/wms/vmap0", { layers: 'basic' });
        map.addLayer(wms);
        map.zoomToMaxExtent();
    
    </script>
            <hr />
        </div>
    
        <script src="/bundles/jquery?v=FVs3ACwOLIVInrAl5sdzR2jrCDmVOWFbZMY6g6Q0ulE1"></script>
    
        <script src="/bundles/bootstrap?v=2Fz3B0iizV2NnnamQFrx-NbYJNTFeBJ2GM05SilbtQU1"></script>
    
        
    
    <!-- Visual Studio Browser Link -->
    <script type="application/json" id="__browserLink_initializationData">
        {"appName":"Chrome","requestId":"0ea737fab0f240fab62a7978c5db4fa7"}
    </script>
    <script type="text/javascript" src="http://localhost:60314/4457514eae394a96a55c4c6c386b7942/browserLink" async="async"></script>
    <!-- End Browser Link -->
    
    </body>
    </html>

Anyone that could help me understand why OpenLayers is not being executed in ASP.NET MVC?