2016-06-29 2 views
1

У меня есть проблема, связанная с подключением моего app.css файла к моему default.html с использованием hapijs и handlebars.js. Я использую Cloud9 для хостинга.Hapi.js не загружает файлы css

Вот мое приложение структура:

root/ 
    client/ 
     config/ 
     route.js 
     css/ 
     app.css 
     view/ 
     layout/ 
      default.html 
     index.html 
server.js 

Мои server.js

'use strict'; 

const Hapi  = require('hapi'); 
const Vision = require('vision'); 
const Inert  = require('inert'); 
const Path  = require('path'); 
const Routes = require('./client/config/route') 

const server = new Hapi.Server(); 

server.connection({ 
    host: process.env.IP || '0.0.0.0', 
    port: process.env.PORT || 3000 
}); 

server.register([Vision, Inert], (err) => { 
    if (err) { 
     throw err; 
    } 

    server.views({ 
     engines: { 
      html: require('handlebars') 
     }, 
     relativeTo: Path.join(__dirname, 'client'), 
     path: 'views', 
     layoutPath: 'views/layouts', 
     layout: 'default', // true 
     partialsPath: 'views/partials' 
    }); 

    server.route(Routes); 
}); 

server.start(() => { 
    console.log('Server started at: ' + server.info.uri); 
}); 

Мои route.js:

const Path = require('path'); 

const routes = [ 
    { 
     method: 'GET', 
     path: '/{param*}', 
     handler: { 
      directory: { 
       path: Path.join(__dirname, 'client'), 
       listing: false, 
       index: false 
      } 
     } 
    }, 
    { 
     method: 'GET', 
     path: '/', 
     handler: (req, rep) => { 

      let data = { };     
      rep.view('index', data); 
     } 
    } 
]; 

module.exports = routes; 

Мои default.html:

<!DOCTYPE html> 
<html lang="fr"> 
    <head> 
     <meta charset="utf-8" /> 
     <title>Title</title> 
     <link rel="stylesheet" href="../../css/app.css" /> 
    </head> 
    <body> 
     {{{content}}} 
    </body> 
</html> 

Мои index.html:

<p id="paragraph"><p> 

Вопрос заключается в том, что мой app.css не загружается. Я следил за this advice и this one, но он все еще не работает, и я не знаю, что проверить дальше.

+0

жаль, что я очень осторожно, чтобы не прочитать код –

ответ

0

Попробуйте <link rel="stylesheet" href="/css/app.css" />

0

, как Джин Диас сказал вам:

это исправить в вашей головной части default.html

<link rel="stylesheet" type="text/css" link="your_file_name.css"/> 
4

Вы можете написать отдельный маршрут для обслуживания файлов ресурсов

если css и js папка внутри resources папка затем

server.route({ 
path: "/resources/{path*}", 
method: "GET", 
handler: { 
    directory: { 
     path: "./resources", 
     listing: false, 
     index: false 
    } 
}}); 

Этот маршрут будет служить вам статическим содержимым, а затем вы можете добавить эти файлы в свой html-файл.

<link rel="stylesheet" href="resources/css/main.css" /> 

для более исх проверить это http://jaskokoyn.com/2014/07/28/views-node-js-tutorial-beginners/

Смежные вопросы