Як я можу використовувати HTML як движок перегляду в Express?

130

Я спробував цю просту зміну з насіння і створив відповідні файли .html (наприклад, index.html).

//app.set('view engine', 'jade');
app.set('view engine', 'html');

і цей файл залишився колишнім:

exports.index = function(req, res){
  res.render('index');
};

але під час бігу я отримую

Помилка 500: Неможливо знайти модуль 'html'

Моя єдина можливість використовувати "ejs"? Моя мета полягала у використанні звичайного HTML спільно з AngularJS.

html node.js express

— Хуліо
джерело

7

Дивіться цю тему для відповіді: stackoverflow.com/questions/4529586/… Сподіваюся, це допомагає,

— roland

3

app.engine ('html', вимагаю ('ejs'). renderFile);

— Дінеш Каніву

91

Відповіді на іншому посиланні спрацюють, але для надання HTML-кодів взагалі не потрібно використовувати механізм перегляду, якщо ви не хочете налаштувати прискіпливу маршрутизацію. Замість цього просто використовуйте статичне проміжне програмне забезпечення:

app.use(express.static(__dirname + '/public'));

— Ден Кон
джерело

3

Я пішов вперед і прокоментував посилання на app.set ('view engine', html). Потім я отримав повідомлення про помилку, що "Не вказано двигуна за замовчуванням і розширення не надано", що очікується. Але коли я змінив res.render ("індекс") на res.render ("index.html"), я отримав таку помилку: TypeError: Properties "двигун" об'єкта # <View> - це не функція.

— Джуліо

4

Більше немає двигуна перегляду, тому я не думаю, що він res.render()більше працюватиме. Натомість покладіть ваші сирі HTML-файли publicі дозвольте статичному середньому програмному забезпеченню безпосередньо обслуговувати файли. Якщо вам потрібні більш фантазійні маршрути, можливо, ви, можливо, зможете створити свій власний механізм перегляду HTML.

— Нік МакКерді

6

Отже, що ви пишете у виклику app.get ()?

— айбраус

5

@ajbraus вам навіть взагалі не потрібен дзвінок app.get (). Це просто обслуговуватиме всі файли html, які у вас безпосередньо в / public папці. Тож у браузері ви просто вказуєте на html безпосередньо, і це все ... в основному немає маршрутизації

— dm76

Проблема, яку я отримую з цим, полягає в тому, що якщо ви оновлюєте сторінку після її завантаження, це дає вам помилку із повідомленням Помилка: Не вказано двигун за замовчуванням і не було передбачено розширення. то якщо ви використовуєте Auth, {Provid: LocationStrategy, useClass: HashLocationStrategy}], він відображає хеш для вашої URL-адреси, що болить з інших причин. Чи є шлях до цього?

— wuno

33

Щоб заставити движок візуалізації приймати html замість нефриту, ви можете виконати наступні кроки;

Установка консолідації і ковток в каталог.
```
 npm install consolidate
 npm install swig
```

додайте наступні рядки у файл app.js

var cons = require('consolidate');

// view engine setup
app.engine('html', cons.swig)
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'html');

додайте шаблони перегляду як .html у папку "перегляди". Перезапустіть сервер вузлів і запустіть додаток у браузері.

Хоча це видасть HTML без жодних проблем, я рекомендую вам використовувати JADE, вивчивши його. Нефрит - це дивовижний двигун шаблону, і це допоможе вам досягти кращого дизайну та масштабованості.

— АнандШанбхаг
джерело

не має методу «двигуна» - після всіх кроків

— ImranNaqvi

Яку версію Express ви використовуєте? Express 4.x містить API app.engine. Більше інформації - @ expressjs.com/en/api.html#app.engine

— AnandShanbhag

Працювали чудово! Я люблю, коли відповідь на рік працює вперше.

— Меттью Снелл

чому він все ще не може зробити мій css та інше

— exe

23

У додаток.js просто додайте

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');

Тепер ви можете використовувати движок перегляду ejs, зберігаючи файли перегляду як .html

джерело: http://www.makebetterthings.com/node-js/how-to-use-html-with-express-node-js/

Вам потрібно встановити ці два пакети:

`npm install ejs --save`
`npm install path --save`

І тоді імпортуйте необхідні пакети:

`var path = require('path');`

Таким чином ви можете зберегти свої перегляди як .html замість .ejs .
Досить корисно під час роботи з IDE, які підтримують html, але не розпізнають ejs.

— Судханшу Гупта
джерело

1

app.set ('views', path.join (__ dirname, '/ path / to / your / folder')); app.set ("параметри перегляду", {layout: false}); app.engine ('html', функція (шлях, opt, fn) {fs.readFile (шлях, 'utf-8', функція (помилка, str) {if (помилка) return str; return fn (null, str) ;});});

— nilakantha singh deo

16

спробуйте це для конфігурації вашого сервера

app.configure(function() {
    app.use(express.static(__dirname + '/public'));         // set the static files location
    app.use(express.logger('dev'));                         // log every request to the console
    app.use(express.bodyParser());                          // pull information from html in POST
    app.use(express.methodOverride());                      // simulate DELETE and PUT
    app.use(express.favicon(__dirname + '/public/img/favicon.ico'));
});

тоді ваші функції зворотного дзвінка до маршрутів будуть мати вигляд:

function(req, res) {
    res.sendfile('./public/index.html');
};

— Коннор П’явка
джерело

14

Жоден механізм перегляду не потрібен, якщо ви хочете використовувати кутовий з простим простим html-файлом. Ось як це зробити: У вашому route.jsфайлі:

router.get('/', (req, res) => {
   res.sendFile('index.html', {
     root: 'yourPathToIndexDirectory'
   });
});

— Ashish Rawat
джерело

1

Абсолютно найпростіше рішення. У мене не встановлено / налаштовано двигун перегляду, і html надсилається.

— Newclique

7

Я рекомендую використовувати https://www.npmjs.com/package/express-es6-template-engine - надзвичайно легку хвилю та палаючий швидкий двигун шаблону. Назва трохи вводить в оману, оскільки може працювати і без expressjs.

Основи, необхідні для інтеграції express-es6-template-engineу ваш додаток, є досить простими та досить зрозумілими:

const express = require('express'),
  es6Renderer = require('express-es6-template-engine'),
  app = express();
  
app.engine('html', es6Renderer);
app.set('views', 'views');
app.set('view engine', 'html');
 
app.get('/', function(req, res) {
  res.render('index', {locals: {title: 'Welcome!'}});
});
 
app.listen(3000);

Розгорніть фрагмент

Ось вміст index.htmlфайлу, знайденого всередині вашого каталогу "views":

<!DOCTYPE html>
<html>
<body>
    <h1>${title}</h1>
</body>
</html>

— дидінько
джерело

4

Відповідь дуже проста. Ви повинні використовувати app.engine ('html') для відображення * .html Сторінок. спробуйте це. Потрібно вирішити проблему.

app.set('views', path.join(__dirname, 'views'));
**// Set EJS View Engine**
app.set('view engine','ejs');
**// Set HTML engine**
app.engine('html', require('ejs').renderFile);

файл .html буде працювати

— Дінеш Каніву
джерело

2

Неповна відповідь. Де проводяться ці зміни? Якщо припустити app.js, але ваша відповідь має бути конкретною. Крім того, це, мабуть, не все, що потребує змін, оскільки результатом внесення саме цих трьох змін / доповнень є "Неможливо знайти модуль" ejs "". Ваша відповідь, ймовірно, близька, але вам потрібно додати трохи більше інформації.

— Newclique

Також рендерінг - це не те саме, що подавати файл. Візуалізація вимагає від сервера попередньо обробити файл і додати будь-який динамічний вміст, переданий у метод візуалізації. Можливо, цього хотіла ОП, але деякі люди пов'язують надання із службою. Дуже різні поняття.

— Newclique

@wade його для візуалізації html-файлу, а не файлу ejs.

— Дінеш Каніву

3

HTML-файли можна візуалізувати за допомогою двигуна ejs:

app.set('view engine', 'ejs');

І переконайтеся, що ваші файли в розділі "/ views" названі ".ejs".

Наприклад "index.ejs".

— JerryFZhang
джерело

Це працює, але відчуває себе трохи хакітним. Чи знаєте ви, чи є якісь застереження щодо використання .ejs замість .html? Ура для, мабуть, найшвидшого виправлення запропоновано все-таки!

— mikeym

3

Прокоментуйте проміжне програмне забезпечення для html, тобто

//app.set('view engine', 'html');

Замість цього використовуйте:

app.get("/",(req,res)=>{
    res.sendFile("index.html");
});

— Шивам Четрі
джерело

2

html не є двигуном перегляду, але ejs пропонує можливість писати html-код всередині нього

— Ваель Чорфан
джерело

1

на сервер html-сторінок через маршрутизацію, я це зробив.

var hbs = require('express-hbs');
app.engine('hbs', hbs.express4({
  partialsDir: __dirname + '/views/partials'
}));
app.set('views', __dirname + '/views');
app.set('view engine', 'hbs');

і перейменував мої .html файли в .hbs файли - рулі підтримують звичайний html

— Авінаш
джерело

1

Щоб заставити движок візуалізації приймати html замість нефриту, ви можете виконати наступні кроки;

Install consolidate and swig to your directory.

 npm install consolidate
 npm install swig

add following lines to your app.js file

var cons = require('consolidate');

// view engine setup
app.engine('html', cons.swig)
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'html');

add your view templates as .html inside “views” folder. Restart you node server and start the app in the browser.

Це має спрацювати

— Пані Мехаді Хасан Мозумдер
джерело

1

Спробуйте це просте рішення, воно працювало для мене

app.get('/', function(req, res){
    res.render('index.html')
  });

— Кірьямвібо Єнусу
джерело

1

Ви повинні додати всі свої рядки, це самостійно не працює.

— MushyPeas

1

Встановити шаблон ejs

npm install ejs --save

Зверніться до ejs у app.js

app.set('views', path.join(__dirname, 'views'));`
app.set('view engine', 'ejs');

Створіть шаблон ejs у видах, як view / indes.ejs, і використовуйте ejs tempalte в маршрутизаторі

router.get('/', function(req, res, next) {
    res.render('index', { title: 'Express' });
});

— kta
джерело

0

Візуалізація html-шаблону за допомогою swig.

//require module swig    
    var swig = require('swig');

// view engine setup    
    app.set('views', path.join(__dirname, 'views'));
    app.engine('html', swig.renderFile);
    app.set('view engine', 'html');

— Харендра Сінгх
джерело

0

Файли Html не потрібно надавати.
що двигун візуалізації - це перетворити файл, який не є файлом Html, у файл Html.
щоб надіслати файл Html, просто зробіть:

res.sendFile("index.html");

можливо, вам доведеться використовувати __dirname+"/index.html"так express, буде знати точний шлях.

— GideonMax
джерело