ホームページ >ウェブフロントエンド >jsチュートリアル >Express サイトでの ejs テンプレート エンジンの使用例の詳細な説明
この記事では主に、Express サイトでの ejs テンプレート エンジンの使用方法を紹介します。編集者はこれが非常に優れていると考えています。編集者をフォローして見てみましょう。皆さんのお役に立てれば幸いです。
VSを使用して作成されたExpressサイトは、デフォルトでjadeテンプレートエンジンを使用しますが、html自体の意味論的特性が私の好みであると考えているため、この方法はあまり好きではありません。また、html自体は十分に簡潔です。テンプレート言語として html 自体を使用する方が私の好みに合っているので、ejs を選択します。
1. インストール
Web サイトのルート ディレクトリでコンソールを起動し、
npm install ejs
と入力します。
パッケージは、node_modules ディレクトリにインストールされます。
2 APP.JSを変更する
app.jsを変更し、ビューエンジンをejsに変更します。 (そして、テンプレートのサフィックスを .html に変更します)
app.set('views',path.join(__dirname , 'views') ); app.engine('.html', require('ejs').__express); app.set('view engine', 'html');
3 テスト ページを作成します
次の内容を含む Index.html を views フォルダーに作成します:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Pivotal Search</title> <meta name="description" content=""> <meta name="author" content=""> <!-- HTML5 shim, for IE6-8 support of HTML elements --> <!--[if lt IE 9]> <script src="http://apps.bdimg.com/libs/html5shiv/r29/html5.min.js"></script> <![endif]--> <!-- styles --> <link href="css/style.css" rel="external nofollow" rel="stylesheet"> </head> <body> <%= title %> </body> </html>
次に、インデックスを変更します。 js:
/* GET home page. */ router.get('/', function(req, res, next) { res.render('index', { title: '测试11111' }); });
関連推奨事項:
reactバックエンドレンダリングテンプレートエンジンnooxリリース使用方法
以上がExpress サイトでの ejs テンプレート エンジンの使用例の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。