web-dev-qa-db-ja.com

ExpressでHTMLをビューエンジンとして使用するにはどうすればよいですか?

シードからこの簡単な変更を試みて、対応する.htmlファイル(例:index.html)を作成しました。

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

このファイルは同じままでした:

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

しかし、実行中に私は得る

500エラー:モジュール 'html'が見つかりません

「ejs」を使用する唯一のオプションはありますか?私の意図は、AngularJSと組み合わせてプレーンHTMLを使用することでした。

117
Julio

他のリンクの答えは機能しますが、HTMLを提供するために、ファンキーなルーティングを設定する場合を除き、ビューエンジンを使用する必要はまったくありません。代わりに、静的ミドルウェアを使用するだけです。

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

レンダリングエンジンがヒスイの代わりにhtmlを受け入れるようにするには、次の手順に従います。

  1. consolidate および swig をディレクトリにインストールします。

     npm install consolidate
     npm install swig
    
  2. 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');
    
  3. 「views」フォルダー内に.htmlとしてビューテンプレートを追加します。ノードサーバーを再起動し、ブラウザーでアプリを起動します。

これは問題なくhtmlをレンダリングしますが、JADEを学習して使用することをお勧めします。 Jadeは素晴らしいテンプレートエンジンであり、これを学習することで、設計とスケーラビリティを向上させることができます。

30
AnandShanbhag

Apps.jsに追加するだけです

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

ビューファイルを.htmlとして保持しながら、ejsビューエンジンを使用できるようになりました

ソース: http://www.makebetterthings.com/node-js/how-to-use-html-with-express-node-js/

この2つのパッケージをインストールする必要があります。

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

そして、必要なパッケージをインポートします。

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


この方法では、ビューを。ejsではなく。htmlとして保存できます。

17
Sudhanshu Gupta

サーバー設定のためにこれを試してください

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
Connor Leech

単純なプレーンHTMLファイルで角度を使用する場合、ビューエンジンは必要ありません。方法は次のとおりです。route.jsファイルで:

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

答えはとても簡単です。 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ファイルは機能します

4
Dinesh Kanivu

HTMLファイルは、ejsエンジンを使用してレンダリングできます。

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

また、「/ views」の下のファイルに「.ejs」という名前が付けられていることを確認してください。

たとえば、「index.ejs」。

3
JerryFZhang

htmlはビューエンジンではありませんが、ejsはその中にhtmlコードを書く可能性を提供します

1
Wael Chorfan

このシンプルなソリューションを試してみてください、それは私のために働いた

app.get('/', function(req, res){
    res.render('index.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.

これは動作するはずです

ルーティングを介して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
Avinash

HTMLのミドルウェア、つまり.

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

代わりに使用します:

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