Stack Overflow em Português Asked by Luiz Couto on November 22, 2021
Fui executar o Node em uma tela que tinha feito em CSS e HTML com Bootstrap e não carrega os estilos.
Failed to load resource: the server responded with a status of 404 (Not Found) *
Refused to apply style from ” because its MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled.
Se alguém tiver uma solução, agradeço.
index.html
<aside class="logo">
<img src="" alt="" class="logo">
</aside>
<header class="header">
<h1><i class="fa fa-home"></i> Título</h1>
<p>Subtitulo do sistema</p>
</header>
<aside class="menu-area">
<nav class="menu">
<a href="/"><i class="fa fa-home"></i> Inicio</a>
<a wm-link="#/HTML/movimento.html"><i class="fa fa-edit"></i> Movimento</a>
<a wm-link="#/HTML/setor.html"><i class="fa fa-clipboard"></i> Setor</a>
<a wm-link="#/HTML/local.html"><i class="fa fa-map-marker"></i> Local</a>
<a wm-link="#/HTML/tipo.html"><i class="fa fa-id-badge"></i> Tipo</a>
<a wm-link="#"><i class="fa fa-file-text-o"></i> Relatórios</a>
</nav>
</aside>
<main wm-link-destino class="content p-3">
conteudo
</main>
<footer class="footer">
<p class="mr-2">Produzido por <i class="fa fa-terminal">SISTCON</i></p>
</footer>
Fundamentos Sistema de Grid Componentes Formulários -->
app.js:
const express = require('express') const app = express()
app.get('/', function(req, res){
res.sendFile(__dirname + '/index.html');
})
app.get('/login', function(req, res){
res.send("testando 2")
})
app.listen(2000)
Não ocorre a importação dos estilos da tela nem da parte de navegação do menu.
navegação.js:
$(document).ready(function(){
(function () { function navegarViaAjax(hash) { if (!hash) return
const link = document.querySelector(`[wm-link='${hash}']`)
if(!link) return
const destino = document.querySelector('[wm-link-destino]')
const url = hash.substring(1)
fetch(url)
.then(resp => resp.text())
.then(html => {
destino.innerHTML = html
const resultado = html.match(/<script>([sS]*)</script>/)
if(resultado && resultado.length >= 2){
eval(resultado[1])
}
})
}
function configurarLinks() {
document.querySelectorAll('[wm-link]')
.forEach(link => {
link.href = link.attributes['wm-link'].value
})
}
function navegacaoInicial() {
if (location.hash) {
navegarViaAjax(location.hash)
} else {
const primeiroLink = document.querySelector('[wm-link]')
navegarViaAjax(primeiroLink)//.hash
}
}
window.onhashchange = e => navegarViaAjax(location.hash)
configurarLinks()
navegacaoInicial()
})()
})
Amigo tente definir a rota estática do seus styles css:
app.use('/static', express.static(__dirname + '/public'))
você pode chamar assim no seu html:
/static/css/styles.css
No express para você chamar arquivos estáticos de styles ou JS vc define a rota estática deles.
Answered by Samuel Marques on November 22, 2021
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP