Как использовать 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 Julio
источник

7

См. Ответ в этой теме: stackoverflow.com/questions/4529586/… Надеюсь, это поможет,

Роланд

3

app.engine ('html', require ('ejs'). renderFile);

Динеш Каниву 06

91

Ответы по другой ссылке будут работать, но для обслуживания HTML нет необходимости использовать механизм просмотра, если вы не хотите настроить фанковую маршрутизацию. Вместо этого просто используйте статическое промежуточное ПО:

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

Дэн Кон
источник

3

Я пошел дальше и закомментировал ссылку на app.set ('view engine', html). Затем я получил сообщение об ошибке: «Не указан механизм по умолчанию и не предоставлено расширение», что вполне ожидаемо. Но когда я изменил res.render ("index") на res.render ("index.html"), я получил следующую ошибку: TypeError: Свойство 'engine' объекта # <View> не является функцией.

Хулио

4

Механизма просмотра больше нет, поэтому я не думаю, что он res.render()будет работать. Вместо этого поместите свои необработанные HTML-файлы publicи позвольте статическому промежуточному программному обеспечению работать с файлами напрямую. Если вам нужны более интересные маршруты, чем этот, вы, вероятно, можете настроить свой собственный механизм просмотра HTML.

Nick McCurdy

6

Итак, что вы пишете в вызове app.get ()?

ajbraus 07

5

@ajbraus вам вообще не нужен вызов app.get (). Это будет просто обслуживать любые html-файлы, которые у вас есть в папке / public. Итак, в браузере вы просто указываете прямо на html и все ... в основном никакой маршрутизации

dm76

Проблема, с которой я столкнулся, заключается в том, что если вы обновляете страницу после ее загрузки, появляется сообщение об ошибке: Ошибка: не указан механизм по умолчанию и не было предоставлено расширение. тогда, если вы используете Auth, {provide: LocationStrategy, useClass: HashLocationStrategy}], он добавляет хэш к вашему URL-адресу, что является проблемой по другим причинам. Есть ли способ обойти это?

wuno

33

Чтобы заставить движок рендеринга принимать html вместо jade, вы можете выполнить следующие шаги;

Установите Consolidate и перейдите в свой каталог.
```
 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 в папку «views». Перезагрузите сервер узла и запустите приложение в браузере.

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

AnandShanbhag
источник

не имеет метода 'двигатель' - после всех шагов

ImranNaqvi

Какую версию экспресс вы используете? Express 4.x содержит API app.engine. Дополнительная информация: @ expressjs.com/en/api.html#app.engine

AnandShanbhag, 03

Сработало отлично! Я люблю, когда годовой ответ срабатывает в первый раз.

Мэтью Снелл

почему он до сих пор не может отображать мой CSS и прочее

frustrated-dev

23

В вашем apps.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 ('просмотры', path.join (__ dirname, '/ path / to / your / folder')); app.set ("параметры просмотра", {layout: false}); app.engine ('html', function (path, opt, fn) {fs.readFile (path, 'utf-8', function (error, str) {if (error) 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

Никакого механизма просмотра не требуется, если вы хотите использовать angular с простым обычным файлом html. Вот как это сделать: В вашем route.jsфайле:

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

Ашиш Рават
источник

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>

didinko
источник

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'». Ваш ответ, вероятно, близок, но вам нужно добавить немного больше информации imho.

Newclique

Кроме того, рендеринг - это не то же самое, что обслуживание файла. Рендеринг требует от сервера предварительной обработки файла и добавления динамического содержимого, переданного в метод рендеринга. Возможно, это то, чего хотел ОП, но некоторые люди объединяют рендеринг с обслуживанием. Очень разные концепции.

Newclique

@wade его для рендеринга html-файла, а не файла ejs.

Динеш Каниву

3

HTML-файлы можно обрабатывать с помощью движка ejs:

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

И убедитесь, что ваши файлы в «/ views» названы с расширением «.ejs».

Например, index.ejs.

JerryFZhang
источник

Это работает, но кажется немного взломанным. Знаете ли вы, есть ли какие-либо предостережения относительно использования .ejs вместо .html? Приветствую вас, вероятно, за самое быстрое решение, предложенное все же!

mikeym

3

Закомментируйте промежуточное ПО для html ie

//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 вместо jade, вы можете выполнить следующие шаги;

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 в таких представлениях, как views / indes.ejs, и используйте ejs tempalte в маршрутизаторе.

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

КТА
источник

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
источник

Как использовать HTML в качестве механизма просмотра в Express?

Ответы: