[英]Simplest possible node.js + nunjucks example
Probably will never use node.js nor Nunjucks for any real development, but now for some reason need:可能永远不会使用 node.js 或 Nunjucks 进行任何实际开发,但现在出于某种原因需要:
Nunjucks
Nunjucks
node.js
node.js
下运行预编译模板I have done:我已经做好了:
node.js
and the npm
(eg have node
and the npm
command)node.js
和npm
(例如有node
和npm
命令)mkdir njtest && cd njtest
npm install nunjucks
(got a node_modules/nunjucks
directory)npm install nunjucks
(获得了node_modules/nunjucks
目录)mkdir templates
in the templates i have created two files index.html
and layout.html
with the following jinja2/nunjucks
content在模板中,我创建了两个文件
index.html
和layout.html
,其中包含以下jinja2/nunjucks
内容
layout.html
<!doctype html>
<head>
<title>simple example</title>
</head>
<body>
<h1>Simple example</h1>
{% block body %}{% endblock %}
</body>
index.html
{% extends "layout.html" %}
{% block body %}
hello world
{% endblock %}
./node_modules/nunjucks/bin/precompile templates >templates.js
and in the templates.js
I have the precompiled code.在
templates.js
中我有预编译的代码。
What I should to do
next to get an running web-server what will use the precompiled template.js
?接下来我应
to do
来获得一个正在运行的网络服务器什么将使用预编译的template.js
?
Please, don't search anything advanced behing this question.请不要搜索这个问题的任何高级内容。 This is probably an stupid-simple question for someone who know node and javascript.
对于了解节点和 javascript 的人来说,这可能是一个愚蠢的简单问题。
What i know, will need, create a file let says app.js
and need run it with the node
- but what should contain?我所知道的,将需要,创建一个文件让说
app.js
并需要与node
一起运行它 - 但应该包含什么?
require 'nunjucks';
and probably something like: var res = nunjucks.render('templates.js');
可能是这样的:
var res = nunjucks.render('templates.js');
and what else?还有什么? (the simplest possible (one time) solution).
(最简单的(一次性)解决方案)。 Note: want use Nunjucks server-side and not in the browser.
注意:要在服务器端而不是在浏览器中使用 Nunjucks。
Start by initialising your Node application as follows: 首先初始化Node应用程序,如下所示:
cd njtest
npm init
You can hit "Enter" to accept the defaults for most of the questions, if you're doing this after creating app.js then it'll automatically detect this and use it as the entry point for your simple server. 您可以按“Enter”接受大多数问题的默认值,如果您在创建app.js 后执行此操作,那么它将自动检测到并将其用作简单服务器的入口点。
Install Express: 安装Express:
npm install express --save
Then create app.js
as follows: 然后按如下方式创建
app.js
:
var express = require( 'express' ),
app = express(),
nunjucks = require( 'nunjucks' ) ;
// Define port to run server on
var port = process.env.PORT || 9000 ;
// Configure Nunjucks
var _templates = process.env.NODE_PATH ? process.env.NODE_PATH + '/templates' : 'templates' ;
nunjucks.configure( _templates, {
autoescape: true,
cache: false,
express: app
} ) ;
// Set Nunjucks as rendering engine for pages with .html suffix
app.engine( 'html', nunjucks.render ) ;
app.set( 'view engine', 'html' ) ;
// Respond to all GET requests by rendering relevant page using Nunjucks
app.get( '/:page', function( req, res ) {
res.render( req.params.page ) ;
} ) ;
// Start server
app.listen( port ) ;
console.log( 'Listening on port %s...', port ) ;
Now fire up a browser, go to http://localhost:9000 and up pops your page! 现在启动一个浏览器,转到http:// localhost:9000然后弹出你的页面!
Hope that helps... 希望有帮助......
I created simple builder for Nunjucks + SCSS + TypeScript我为 Nunjucks + SCSS + TypeScript 创建了简单的构建器
DOCS: https://github.com/Artik-Man/SamuraiJS文档: https://github.com/Artik-Man/SamuraiJS
NPM: https://www.npmjs.com/package/samuraijs NPM: https://www.npmjs.com/package/samuraijs
npm i samuraijs
Create samurai.js
file:创建
samurai.js
文件:
import {Samurai} from "samuraijs";
new Samurai({
paths: {
source: 'src',
destination: 'dist'
}
});
Add the following lines to your package.json:将以下行添加到您的 package.json:
{
"scripts": {
"serve": "node samurai.js --serve",
"build": "node samurai.js --build"
},
"type": "module"
}
Place your *.njk files at the src/
directory, run将你的 *.njk 文件放在
src/
目录下,运行
npm run serve
And open localhost:3000
并打开
localhost:3000
Or npm run build
to build the project.或者
npm run build
来构建项目。
Dont think about build configuration.不要考虑构建配置。 Just code your project!
只需编写您的项目!
I hope my builder solves your problem:)我希望我的建造者能解决你的问题:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.