JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://openlayers.org/en/v3.0.0/css/ol.css">
<script src="http://openlayers.org/en/v3.0.0/build/ol.js"></script>
<div id="map" class="map"></div>

CSS

.map {
    width: 400px;
    height: 400px;
}

JavaScript

var src_dnpm =  new ol.layer.Tile({
		    source: new ol.source.TileWMS({ 
                url: "http://sigmine.dnpm.gov.br/arcgis/services/extra/dados_dnpm/MapServer/WMSServer",
                serverType: 'geoserver',
                params:{
                    LAYERS:"6",

                }
             })
		});
    var src_dnpm =  new ol.layer.Tile({
		    source: new ol.source.TileWMS({ 
                url: "http://sigmine.dnpm.gov.br/arcgis/services/extra/dados_dnpm/MapServer/WMSServer",
                serverType: 'geoserver',
                params:{
                    LAYERS:"6",

                }
             })
		});
var src_mma = 
new ol.layer.Tile({
	source: new ol.source.TileWMS({
            url: 'http://mapas.mma.gov.br/cgi-bin/mapserv?map=/opt/www/html/webservices/ucs.map',

            params: {
              layers: '0',
              crossOrigin: null,
              //crossOrigin: 'anonymous',
              serverType: 'mapserver',
              //projection: 'EPSG:4326',
              //projection: 'EPSG:3857',
              //projection: 'EPSG:4291',
              //srs : "EPSG:4618",
              //version: '1.3.0',
              format:"image/png",
            },
            serverType: 'mapserver'
          })
          
     });     
map = new ol.Map({
        target: 'map',
		layers: [ src_mma],
		view: new ol.View({
			center: [-43, -19],
			zoom: 14
		})
	});



          
map = new ol.Map({
        target: 'map',
		layers: [ src_mma, src_dnpm],
		view: new ol.View({
			center: [-19, -43],
			zoom: 14
		})
	});