Добавление CSS на hapi.js не работает
Используя плагин инертный, я попытался добавить общую папку, в которой хранил свои файлы css, js. Но в моей папке Просмотры я не могу получить к ним доступ. Я использую руль. Даже если я оставлю только стиль.css в папке Просмотры, HTML не сможет получить доступ к этому файлу стиля.
Это моя структура папок:
app.js
public
css
style.css
views
home.html
routes
user.js
App.js
const server = hapi.server({
port: Number(process.argv[2] || 3000),
});
const init = async () => {
await server.register(vision);
await server.register(inert);
server.views({
engines: {
html: handlebars
},
path: path.join(__dirname, 'views'),
relativeTo: path.join(__dirname, 'public')
});
}
Я попытался добавить относительный путь также на сервер следующим образом:
const server = hapi.server({
port: Number(process.argv[2] || 3000),
routes: {
files: {
relativeTo: Path.join(__dirname, 'public')
}
}
});
Но тщетно.
Главная.html
<html>
<head>
<title>Login page</title>
<link rel = "stylesheet" href = "../css/style.css" />
</head>
<body>
<h2> Welcome </h2>
</body>
</html>
стиль.css
body {
background: #456;
font-family: 'Open Sans', sans-serif;
}
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Вы должны определить маршрут для обслуживания содержимого вашей общей папки.
Это можно сделать с помощью Обработчик каталогов:
const init = async () => {
await server.register(vision);
await server.register(inert);
server.views(...)
server.route({
method: 'GET',
path: '/public/{param*}',
handler: {
directory: {
path: path.join(__dirname, 'public')
}
}
})
}
Это создаст маршрут, который будет обслуживать любой контент в каталоге public, поэтому ваш css будет доступен через http://локальный: 3000/public/css/style.css.
Это означает, что вам не нужно обращаться к таблице стилей по относительному пути, и вы можете использовать абсолютный путь в своем home.html:
<link rel = "stylesheet" href = "/public/css/style.css" />
Маршрут, который обслуживает статический контент, в основном не имеет отношения к вашим файлам шаблонов, на самом деле директива routes.files.relativeTo только говорит hapi использовать предоставленный вами путь, поэтому при вызове h.view в обработчике маршрута путь будет разрешен из relativeTo, так что это только полезно внутри сервера, а не от клиента (например, представления). Что делает ваш файл user.js?
user.js содержит все мои server.routes, т.е. return h.view('home') files. Я экспортировал их для использования на app.js. Ну, я понял это, изменив путь к каталогу на path.join(__dirname, ../'public')
это сработало спасибо. Но что, если вместо сохранения этого маршрута в файле app.js я хочу сохранить его в папке маршруты в файле user.js? для этого мне нужно изменить свою html-ссылку на
href = "../public/css/style.css"? Я пытался, но это не сработало. Я изменил структуру папок. Пожалуйста, посмотрите