Я не могу получить доступ к своему файлу css и js публично в папке index.hbs в представлениях

#node.js #express #view #backend #hsb

Вопрос:

Я пытаюсь получить доступ к файлу css и js, который находится в общей папке, из index.hbs, который находится в папке views.

index.js файл:

         const express = require('express')
        const path = require('path')
        // const hbs = require('hbs')
        const app = express()
        const port = 3000

        // const stat = path.join(__dirname, '../public')

        // app.use(express.static(stat))
        app.set('view engine' ,'hbs');
        app.set('/' ,path.join(__dirname, '/views'));


         app.get('/', (req, res) => {
          res.render('index', {})
          })
          app.get('/', (req, res) => {
          res.send("Hello")
          })

         app.listen(port, () => {
        console.log(`Example app listening at http://localhost:${port}`)
        })
 

ССЫЛКА css и JS в index.hsb:

 <link rel="stylesheet" href="css/style.css">
<script src="javascript/main.js"></script>
 

Структура папок

Комментарии:

1. Вам нужно использовать express.static промежуточное программное обеспечение, например app.use(express.static('public')) , где public имя папки

2. Возможно, вам захочется ознакомиться с документацией expressjs.com/en/starter/static-files.html

Ответ №1:

1. Добавьте это промежуточное программное обеспечение в указанный index.js выше механизм просмотра

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

2. Структура Папок

 |__public/   
    |__ css/
        |__ css files...
    |__ js/
        |__ js files...
 

3. Импортируйте таким образом

Теперь вы задаете путь к общедоступному каталогу, который вы должны указать в общей папке при импорте

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

Теперь вы должны быть полностью настроены для доступа к css или любому файлу