внешняя таблица стилей в шаблоне мопса не будет загружаться

1

Я не могу понять, как получить таблицу стилей для загрузки в мопс. Я пробовал все, о чем я могу думать. и широко искали в Google. Это кажется такой глупой проблемой, но я уже потратил столько времени, пытаясь понять это.

Моя файловая структура выглядит следующим образом

/main
    server.js
    package.json
    /views
        layout.pug
        main.pug
    /public
        style.css

Во всех следующих примерах я попытался ссылаться на файл следующим образом:

  • href="../public/style.css"
  • href="./public/style.css"
  • href="/public/style.css"
  • href="public/style.css"

а также

  • href="/style.css"

Я пытался:


1) элемент ссылки в main.pug

    //- daytime page
    extends layout.pug
    block styles
        link(rel="stylesheet" type="text/css" href="../public/style.css")

2) В layout.pug с использованием include

//- layout
doctype
html
  head
    meta(charset='UTF-8')
    block title
      title country
    block styles
  body
    style.
      include ../public/day.css

AS WELL AS внутри заголовка


3) В layout.pug, используя

//- layout
doctype
html
  head
    meta(charset='UTF-8')
    block title
      title country
    block styles
      link(rel="stylesheet" type="text/css" href="../public/style.css")
body

Проверить источник

Когда я проверяю источник файлов мопса, содержащих элемент мопса. браузер показывает, что ссылка была правильно отображена внутри родителя.

Изображение 174551

css загружается, когда я пишу его непосредственно в файле-мопете так:

style.
    selector{
        rule
        rule
}

Я не могу сохранить свой css inline, и я не могу использовать html непосредственно в файле мошенника (правила назначения). Почему мои таблицы стилей не загружаются?


Технические характеристики:

  • Firefox 56.0
  • Ubuntu 16.04
  • мопс 2.0
  • выразить 4.16.2
  • 1
    Некоторые браузеры не принимают горячую загрузку CSS. Вы должны попробовать .createElement('link') с событием .onload
  • 1
    Вы когда-нибудь выясняли почему? У меня такая же проблема :/
Теги:
pug
pugjs

1 ответ

1

Проверьте, установлена ли общедоступная папка как статическая внутри server.js

app.use(express.static(path.join(__dirname, 'public')));

то в файлах мошенников добавьте

head
block styles
  link(rel="stylesheet" type="text/css" href="/style.css")

Ещё вопросы

Сообщество Overcoder
Наверх
Меню